- 博客(71)
- 资源 (11)
- 收藏
- 关注
原创 TS 枚举、泛型、类、Partial和Required
抽象类内部的抽象属性和抽象方法需要被继承的类来实现,但它内部的普通属性和方法则可以直接被继承使用。枚举的作用很简单,就是用来列举数据,管理一系列数据的,让数据分类更加直观和可读,利于维护。一个类继承了一个接口后,也必须将这个接口的所有属性和方法 实现 ,和抽象类性质也是一样的。泛型就是将类型也参数化,有时类型不明确,需要在用到时候才能指定,这时就可以使用泛型。它本身不能实例化,只能被继承,需要继承后的类来实现它内部的抽象属性和抽象方法。泛型用 T 代替,这个只是规范,用其他的字符代替也行,
2023-11-13 07:42:22 210
原创 TypeScript 接口 、类型别名
接口类型是一种自定义类型,可以让我们自定义出一种数据类型的格式,之后在声明这种类型时值的格式都必须按照接口说描述好的来定义。用type关键字可以声明类型别名,这个类型别名和接口其实有点类似,都是可以用来自定义一个类型。这里 [id:number] 代表的是下标的类型 后面代表的是值类型。这种方式声明的字段代表该字段不是必须的字段,可以不写。声明的字段代表该字段是只读,不可在改。代表返回值的类型为空,可以不返回值。用类型别名来声明一个函数的类型格式。声明一个接口是首字母应该大写。代表函数传入的参数的类型,
2023-11-08 08:14:00 74
原创 TypeScript 初识
并且因为ts是静态类型定义,它在你写代码的时候就会报错,而不是等到编译的时候才报错,而js是动态类型定义,你写代码的时候它是不知道这是什么类型的,要等到编译时才会知道类型,因此如果报错那就只会在运行的时候才会报错,这样就很不友好。例如下面的例子,我们直接调用number类型的toFixed方法,就会报错,因为它类型未知,并不确定是否是number类型,因此也就调用不了。ts 的关键之处就在于他的类型定义,在ts中我们给一个变量赋值了之后,他的类型就固定下来了,你可以去改它的值,但不能改变它的类型。
2023-11-06 07:34:10 59
原创 07/06 readonly和shallowReadonly、toRaw和markRaw、provide和inject、isRef,teleport和suspense
正常情况下我们一般都是同步引入组件,但在同步引入的情况下,会有个问题,必须等所有的组件全部加载完成之后才会一起显示,例如有个嵌套组件外面几层的组件加载的都很快,但最里面的组件内容很多,加载的慢,但如果同步引入的话,外面的就需要一起等里面的加载完成之后才会一起显示,这样就很慢。、他们的用处不是特别大,只在极少数场景能用到,例如某一个公共功能,这个功能里面返回一个数据,这个数据在其他模块都是可以改的,但是在另一个模块不可改,也不能发生变化,只用来显示,此时就可以使用readonly。
2023-07-06 09:50:35 75
原创 07/05 watch以及watchEffect、生命周期以及hook、toRef和toRefs、shallowRef和shallowReactive
其实他们的重点就在于使用场景不同,例如某一个复杂的业务场景,有很多个相关的计算逻辑,这些计算逻辑任意一个发生变化时都需要重新执行某些事时,此时就可以用到watchEffect,例如购物车系统,与购物车相关的商品发生变化整个购物里的价格逻辑都要发生改变。而下面这个就是watch监听器高级的用法了,这也是它比vue2的更方便的原因,watch总共有三个参数,第二个参数永远是监听的回调函数,第三个参数也永远是监听的配置项,配置是否初始化监听一次,或者是否深度监听,下面这是watch第三个需要注意的地方,
2023-07-05 11:33:12 48
原创 06/19 vue3中的数组重新赋值的坑
2,另外一种是通过reactive,但不直接创建一个数组,而是创建一个对象,对象里面在创建一个数组,data.arr=[] 这种方式也是可以的,这种方式相当于是在改对象里面的某个属性,因此也能做到直接赋值。3中的数组如果是reactive直接定义的话不能通过赋值的方式改变界面,目前有两种方式解决这个问题。1,是直接用ref([1,2,3])定义,通过arr.value的方式,这种可以直接赋值是有效的。
2023-06-19 15:10:10 358
原创 06/13 vue3 setup ref reactive 响应式
这两种写法官方是推荐下面这种的,单论便捷性的话,也是下面这种写法更好,但是实际上在真实使用过程中可能还是会存在使用到选项式的地方,这种情况下下面这种写法就不能用了,所以这种情况还是使用上面那种方式更好,总之都能用,看个人喜好,喜欢那种方式就用哪种方式。另外需要注意的是选项式和组合式尽量不要混用,他可以混用,但有问题,选项式api中可以拿到组合式api中setup定义的数据,但组合式api的setup中不能拿到选项式中的数据,另外如果有重名的情况下,以setup中的数据优先级更高。,这个和vue2是一样的。
2023-06-13 13:35:47 34
原创 快速删除node_modules目录的方式
当安装了较多模块后,node_modules目录下的文件会很多,直接删除整个目录会很慢,下面介绍些快速删除node_modules目录的方法。方法一:使用rimraf模块的命令在全局安装rimraf模块,然后通过其命令来快速删除node_modules目录:npm install rimraf -grimraf node_modules方法二:使用命令来删除目录Windows下使用rmdir命令首先在cmd窗口中进入到node_modules文件夹所在的路径,接着执行命令:
2021-10-24 18:13:59 2364
转载 jsplumb 文档实例
https://github.com/wangduanduan/jsplumb-chinese-tutorial#211-%E9%99%90%E5%88%B6%E8%8A%82%E7%82%B9%E6%8B%96%E5%8A%A8%E5%8C%BA%E5%9F%9F
2021-07-23 16:35:59 288
原创 Echarts数据可视化legend图例属性设置
//Echarts数据可视化legend图例属性设置legend={ show:true, //是否显示 zlevel:0, //所属图形的Canvas分层,zlevel 大的 Canvas 会放在 zlevel 小的 Canvas 的上面 z:2, //所属组件的z分.
2021-03-17 08:25:36 2354
原创 js 的 defineProperty 数据劫持
我们知道,在Vue中我们操作某个属性时vue可以实时响应,这是因为当一个vue实例被创建出来之后,它会生成一个Observer观察者实例,然后对vue中的对象属性进行遍历,通过defineProperty将它们转换为了getter和setter,当我们操作某个数据时,就会触发getter和setter,从而完成一个监听操作。下面我们详细解释一下defineProperty以及它的优劣所在:Object.defineProperty(obj,"",{})defineProperty总共有三个参数
2021-01-30 10:38:41 829 2
原创 Vue 路由机制的两种实现模式
Vue的路由机制主要是通过两种模式实现的第一种模式是hash模式 第二种是H5的history模式这是默认的hash模式的路由:改成history模式后const router = new VueRouter({ mode:"history", routes})export default routerHash模式hash模式是以url的hash值来作为路由,这也是vue的默认模式;hash模式的原理是动态的更改location.hash的值
2021-01-30 09:22:42 1427
原创 详解Vue中的Key和虚拟dom以及diff算法
一 虚拟dom在react,vue等技术出现之前,我们要改变页面展示的内容只能通过遍历查询 dom 树的方式找到需要修改的 dom 然后修改样式行为或者结构,来达到更新 ui 的目的。 这种方式相当消耗计算资源,因为每次查询 dom 几乎都需要遍历整颗 dom 树, 并且这个过程又会不可避免的出现大量DOM操作,而DOM的变化又会引发整个文档重排或重绘,从而降低页面渲染性能 此时就产生一个问题,有没有可能我们只更新我们修改的那一部分dom而不要更新去整个dom结构 此时虚拟DOM应用而生 ,如果
2021-01-25 15:13:32 867 1
原创 Js 详解事件循环 Event Loop,以及宏任务和微任务
要明白事件循环我们首先要了解渲染引擎渲染引擎是个多线程程序 它其中包含了四个线程js引擎线程 事件触发线程 定时任务线程 异步任务线程首先呢 js中包含了同步任务和异步任务两种,首先js引擎线程会创建一个执行栈,所有的同步任务都会被放到这个执行栈中来执行 同时事件触发线程管理着一个任务队列,当一个异步任务被触发后它内部的回调函数就会被放到这个任务队列中,注意此时它并不会执行这个回调函数,只是将它放入任务队列。 然后等js引擎线程中的执行栈中的同步任务执行完成之后,它就会去读取
2021-01-19 12:20:09 183
原创 Vue过场动画判断是进入还是退出 一行代码 完美解决
在Vue开发中 我们有时需要给场景切换加上一个过场动画 但是有一个难题 过场动画如何判断到底是进还退出的我在网上也找过很多方法,比如最常见的就是给路由的meta中加一个标识 通过标识判断大小 从而知道是退是进但是如果路由很多,怎么办,那要判断标识都是一个难题,苦思冥想许久,突然想到一个究极解决办法,我们可以通过时间来判断啊,我们在路由守卫中,每当进入一个路由之前,给他加个时间戳router.beforeEach(async (to, from, next) => { i
2020-12-31 15:06:49 348 1
原创 js 动态拼接正则表达式
在js中很多时候我们都需要使用正则 比如这里我利用正则查找字符 a 后面跟着一个或多个空格的内容,我们便可以这么做let str = "abcdefa aab bb"let reg = /a\s.*/console.log(reg.exec(str))但如果我们把条件改了,我们要查找字符b后面跟着一个或多个空格的内容,那我们不可能去再重新写一个正则这是我们便可以动态的去拼接正则,再js中不能直接使用常规的字符串拼接方式来拼接,它必须使用eval来进行拼接let str =.
2020-10-26 18:29:02 6508
原创 利用css after伪元素制作时间线(步骤条)效果
效果图如下<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> *{ margin: 0; padding: 0; } .wrap{ width: 300px; height: 60px; border: soli
2020-10-16 14:50:52 573
原创 纯css制作圆形进度条
效果图大概是这样的第一步 先定义出一个方形盒子<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title></title> <style&g.
2020-06-04 15:47:06 2278 1
原创 如何重置 Vue 中 data 的数据为初始状态
在vue中有时我们需要将data中的数据重置为初始状态,例如我们发布一篇文章,发布完成之后我们希望和表单双向绑定的对象重置为初始状态那么此时我们有两种办法,第一种,手动去给表单双向绑定的对象赋值为空data(){ return{ Notica:{ title:"", content:"", } ...
2020-04-01 15:42:32 4890
原创 关于在vue中使用amap高德地图插件出现的错误! iframe.postMessage 以及 onmessage 数据重复反馈的原因及解决办法
项目是用Vue做的 使用的是高德地图的插件需求是这样的 选择地址后,点击下面的地址列表中的某一个然后会返回这个地址的信息,例如名称,经纬度之类的,例如点击老成都返回老成都的地址信息我代码是这么写的HTML部分<iframe id="getAddress" @load="loadiframe" src="https://m.amap.com/picker/?key=...
2020-04-01 15:21:20 1187
原创 JavaScript中 let ,const 和 var的区别
我们以前在js中常用的声明变量的方式是var,但在es6中新增了两个新的声明变量的方式,那就是let和const1 声明的区别首先是var声明的变量var声明的变量会触发变量声明提升变量声明提升说简单点就是说用var声明的变量可以在变量声明之前使用console.log(a);//undefinedvar a = 10;console.log(a);//10//这样写不...
2020-01-05 09:22:11 155
原创 常见的DOCTYPE类型声明
HTML 5<!DOCTYPE html>HTML 4.01 Strict这个 DTD 包含所有 HTML 元素和属性,但不包括表象或过时的元素(如 font )。框架集是不允许的。<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">...
2019-12-26 14:57:51 201
原创 原生js的Ajax请求详解
Ajax是可以用来与服务器进行通讯的一种技术,它可以在不刷新页面的情况下进行异步通讯并获得返回结果。Ajax常用的请求方式有两种,GET和POST,接下来将详细给出这两种请求方式的异同,以及Ajax使用时需要注意的地方。1 GET请求get请求一般用在向服务器请求某些资源,例如请求一段文章,或者一张图片等等。下面是完整的get请求的方式 我们可以看到,在获得XMLHttpReque...
2019-12-22 09:13:36 582
原创 在访问服务器上的php文件时,并没有解析 而是直接显示源码
在浏览器上访问阿里云服务器上的php文件时,并没有解析php文件,而是直接输出这个文件的源码,经过检查发现是没有安装php扩展安装即可yum install mod_php...
2019-12-06 17:56:29 2222
原创 服务器上 thinkphp后台报错could not find driver
在访问阿里云服务器上的thinkphp后台时报了个错could not find driver经过检查发现应该是没有安装mysql的驱动 安装完就没事了yum install php-mysql
2019-12-06 17:53:13 510
原创 访问服务器上的thinkphp后台时报错 Class 'PDO' not found
访问阿里云服务器上的thinkphp后台时报了个错,经过检查发现是没有安装pdo扩展,安装完就没事了yum install php-pdo
2019-12-06 17:51:07 355
原创 在请求服务器上的Thinkphp5后台时报错 500 internal server error
使用Vue项目请求我自己阿里云服务器上的Thinkphp5后台时报了个500错误 经过检查发现是没有给Thinkphp后台的log文件夹加上访问权限,加上就没问题了进入你自己的Thinkphp项目的runtime目录下,有个log目录cd /var/www/html/thinkphp/runtime/给log目录加上所有权限即可chmod -R 777 log ...
2019-12-06 17:47:05 2245
原创 Mysql 远程访问报错SQLSTATE[28000][1045] Access denied for user 'root'@'localhost'
在本地访问远程阿里云服务器上的mysql后台时出现了这样的错误,经过检查 是root访问权限的原因首先在自己的linux服务器上登录mysql输入如下命令 然后输入自己的数据库密码即可mysql -u root -p然后输入下面这条代码,给予root所有访问权限grant all on *.* to 你的数据库用户名@'你的服务器ip地址' identified by '你...
2019-12-06 17:40:43 1181
原创 css 画三角形
利用css画三角形 原理其实很简单其实就是改变div的边框来画出三角形 .box{ width: 0px; height: 0px; border: solid 100px black; }首先我们定义一个div,高宽设置为0,但是我们将它的border设置为100px,颜色先设置为...
2019-11-23 12:06:29 127
原创 yum 安装 httpd报错 No package httpd available
安装httpd,如果出现No package httpd available,可以尝试:yum --disableexcludes=all install -y httpd
2019-11-21 19:31:22 8712 13
原创 vue clie 3.0 引入全局scss报错解决,已经解决
在vue.config.js中进行配置这是以前的配置方法这样进行配置后会报错module.exports = { css: { loaderOptions: { sass: { data: `@import "@/lib/hotcss/px2rem.scss";` } } }}改成这种形式,就能正常运行,将da...
2019-11-07 21:11:38 647
原创 原生js手写java链表集合
链表集合是java中的多种集合之一,从名字就能听的出,这种集合它的底层实现使用了链表。链表是一种数据结构,它的排列方式很像一根链条,链表是由很多节点组成的,每个节点包含三个属性,previous,Value,nextprevious存储着上一个节点,next指向下一个节点,value存储着当前节点的数据,链表就是使用这样的方式将每个节点连接在一起,像链条一样,环环相扣使用链表...
2019-10-19 08:20:12 162
原创 将git本地仓库的项目推送到github的远程仓库上
首先 第一步 你得在电脑上装个git傻瓜式安装即可 没什么难度第二步 在github上创建一个远程仓库如果没有github的账号,可以去注册一个首先点击 You repositories然后会进入到用户中心 此时点击 New 即可进入到创建仓库的页面,如果你是第一次注册的话,注册成功之后应该默认就会跳转到创建仓库的页面来进入到创建仓库的页面后,什么...
2019-10-18 18:57:47 571
原创 css3中四种让元素水平居中的方式
第一种<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-eq...
2019-10-18 18:03:27 358
原创 如何下载b站视频
在你要下载的视频网址前加上三个字母比如要下载这个视频https://www.bilibili.com/video/av59529105/?p=62把这个网址改成这样后输入到地址栏你会发现新世界的大门https://www.kanbilibili.com/video/av59529105/?p=62貌似所有视频都可以...
2019-09-18 17:43:31 8900 1
原创 使用原生js编写Vue双向数据驱动(1)
观察者模式与数据劫持部分还没完成,有时间在继续更新function Vue(options){ this.$el = options.el; this.$data = options.data; if(this.$el){//若这个el节点存在不为空,则编译模板 //将data中的数据 全部转化成Object.defineProperty来定义 这样我...
2019-08-19 10:40:28 211
原创 js reduce累加器
reduce 是es6 新增的数组操作方法 意为累加器使用方法如下[1,1,1,1].reduce((total,currentValue,index)=>{},initialValue)initialValue 代表的是累加器的初始值 必填total的值在初始情况下等于initialValue 用来接收返回的结果 必填currentValue 代表数组中的每一项...
2019-08-17 16:10:45 1733 1
原创 Javascript对象浅拷贝和深拷贝
javascript 中的引用数据用赋值运算符进行赋值时复制的是变量的引用地址 这就是我们所说的浅拷贝当进行浅拷贝时,拷贝后的变量和被拷贝变量其实都是引用的是一个地址也就是说当一个改变时 另一个也会跟着改变而在拷贝基本数据类型时 例如 numbar 整形时 拷贝的变量和被拷贝的变量没有直接关系,因为此时它们的拷贝是变量的值这是拷贝基本数据类型 此时拷贝的变量...
2019-07-09 20:00:24 91
unity2d 游戏开发资源 unity2d 游戏开发资源
2018-10-04
c# winfrom socket模拟QQ多人聊天
2018-05-18
仿android计算器 仿android计算器
2018-05-04
找不到模块“@/router/index”或其相应的类型声明
2023-11-21
TA创建的收藏夹 TA关注的收藏夹
TA关注的人