- 博客(23)
- 收藏
- 关注
原创 用vite2开发vue2项目爬坑
less原项目中用的相对路径~@/style/..,在vite里的路径别名还得为~@专门配置,不像webpack只需配置@的路径别名
2021-03-11 11:50:15
1602
1
原创 vue笔记
vue中key的作用及原理作用:key能提升列表渲染速度,而且能在列表增、删、改的时候保持无需变动项的组件或dom状态。原理:vue在更新列表时,会复用旧列表中的VNode,由于vue会遍历旧列表的项,当没有key的时候,vue又会遍历新列表的项,导致性能变差;当有key的时候,vue会先遍历新列表,缓存新列表的key,这样通过map的方式提升性能。...
2021-02-27 20:09:33
140
原创 网络知识笔记
302、303、307在HTTP1.0中,302表示客户端发出POST请求后接受到服务器302状态码,必须跟用户确认是否该重发,因为第二次POST时,环境可能已经发生变化(嗯,POST方法不是幂等的),POST操作会不符合用户预期。但是,很多浏览器(user agent我描述为浏览器以方便介绍)在这种情况下都会把POST请求变为GET请求。为了解决这个,HTTP1.1中新增303和307状态码。303表示POST重定向为GET;307表示当发起POST请求要重定向时,要询问用户是否应该在新URI上.
2021-02-23 12:38:12
348
原创 VUE 3.0源码之任务调度模块
任务调度模块的功能在runtime-core下的scheduler文件变量首先会定义几个全局变量用于存储任务和状态。// 主任务队列,用于存储更新任务const queue: (Job | null)[] = []// 后置回调,任务队列执行完毕后执行const postFlushCbs: Function[] = []// 微任务const p = Promise.resolve()// 是否正在执行队列let isFlushing = false// 微任务已创建,任务队列等待执
2021-02-02 12:42:47
579
原创 VUE-ROUTER源码阅读理解
1. VUE-ROUTER注册主要就是定义获取$router和$route的方式,然后就是注册RouterView和RouterLink两个组件,最后定义路由钩子的合并策略。其它还包括配合缓存组件实例。export function install (Vue) { if (install.installed && _Vue === Vue) return install.installed = true _Vue = Vue const isDef = v =>
2021-01-26 11:03:14
271
3
原创 uni-app中使用vant注意事项
需要下载vant的weapp版源码,将dist目录复制到uniapp项目中,路径:项目/wxcomponents/vant引入后hbuilderx会自动给每个组件生成一个vue文件,但是会包一层uni-shadow-root,如果同时使用uni官方的组件且是通过easycom的custom使用的,则会冲突,需要将正则改为^uni-((?!(shadow-root)).)如果报了vant的css错误(Unclosed bracket),则全局搜索https://img.yzcdn.cn/vant/van.
2020-12-08 16:59:17
6760
3
原创 ajax下载文件
this.request(Object.assign({ responseType: 'blob' }, options), params).then((res) => { if (!res?.data) { message('未能获取文件流') return Promise.reject() } try { let contentDisposition = res.headers['content-disposition'].repl
2020-11-17 15:56:40
865
原创 VUE 3.0源码之watch和watchEffect
1.watch和watchEffect这两都是直接调用doWatch方法,唯一区别就是第二个参数不同。export function watchEffect( effect: WatchEffect, options?: WatchOptionsBase): WatchStopHandle { return doWatch(effect, null, options)}export function watch<T = any>( source: WatchSource
2020-11-11 17:38:26
1245
1
原创 vue使用技巧
透传透传props<child-component v-bind="$props"></child-component>透传attrs<child-component v-bind="$attrs"></child-component>透传object<child-component v-bind="obj"></child-component>透传object<child-compone.
2020-10-14 16:00:53
238
原创 VUE 3.0源码之reactive
1. reactive如果是readonlyToRaw(以proxy为可以,已原始值为value的WeakMap,大概表示只读的代理)里的或者是ref的都不处理2. createReactiveObject如果typeof不是object则报警告如果已经代理过了则直接返回代理了的proxy如果本来是proxy则返回如果不满足canObserve则直接返回target如果是set...
2020-09-18 18:17:43
286
原创 VUE 3.0源码之effect
effect方法可以用于计算属性功能,通过触发proxy的get方法实现将自身加入到proxy的deps中,实现与proxy关联常规使用步骤1. effect创建一个effect函数,创建时会想调用一遍,这样可以调用相关get并将effect加入相关proxy的deps中function effect<T = any>( fn: () => T, option...
2020-09-17 21:36:40
508
原创 VUE 3.0源码之computed
1. 入口computed方法首先调用_computed实现计算属性,然后调用recordInstanceBoundEffect记录当前的effect,方便当组件卸载时清除import { computed as _computed } from '@vue/reactivity'function computed<T>( getterOrOptions: ComputedGetter<T> | WritableComputedOptions<T>) {
2020-09-17 16:10:54
669
原创 VUEX源码阅读理解
1. Vuex注册let Vuefunction install (_Vue) { Vue = _Vue applyMixin(Vue)}首先定义一个全局变量Vue用于存储传入的Vue,这样可以不使用import Vue from 'vue'的形式引入Vue,这也是为什么实例化前要先使用Vue.use()。然后调用applyMixin(Vue)调用一个全局混入// applyMixinexport default function (Vue) { const version = N
2020-09-09 17:19:40
254
原创 ts加node开发碰到的问题
问题解决办法在tsconfig.json中的typeRoots添加typings没有起作用,编译器和tsc编译都报错发现是直接加.d.ts不会读取,需要再加一层文件夹,再在下面加index.d.ts就可以解决在tsconfig.json中配置了paths,编译器可以但tsc编译报错通过给命令添加-r tsconfig-paths/register解决,如ts-node -r tsconfig-paths/register ./src/main.ts...
2020-06-15 15:45:03
1879
原创 less变量及函数记录
@size: small, large;@smallWidth: 24px;@largeWidth: 40px;// @n > 0 表示@n等于或小于0就结束.size-loop(@n) when (@n > 0) { // 从@size中取第@n个。 // 注意:从1开始,并不是数组中的从0开始 @s: extract(@size, @n); // 这里...
2020-03-28 22:04:23
523
原创 css杂记
1、图片在不失真的条件下尽量铺满可以将图片设置max-width和max-height设为100%,若要居中则设text-align: center和行高。2、margin和padding的百分比是根据父元素的宽度的,自测发现不包括padding、border、margin的宽度。3、将元素设为overflow: auto;可以默认不显示滚动条只在超出后显示滚动条。4、position...
2019-04-30 16:05:57
214
原创 将自己的组件通过插件形式使用
在vue中注册插件支持对象或函数,如果使用对象则需要install方法下面是使用函数注册的方法export default function (Vue, opts) { //opts是在安装该插件时可以传入的 //全局注册组件 Vue.component('组件名', components) //全局方法 Vue.prototype.myFunct...
2018-12-10 16:10:45
364
原创 函数式组件
函数式组件需要将functional设为true,它没有状态,没有上下文单文件中函数式组件的实现:<template functional></template>组件注册中函数式组件的实现:Vue.component('my-component', { functional: true, // Props 可选 props: { /...
2018-12-10 15:28:04
4277
原创 js原型
基本概念:prototype:显性原型,获取共享的属性和方法 __proto__:隐式原型,指向构造函数的原型,如:function a(){}; var b = new a(); b.__proto__ == a.prototype constructor:指向的是构造函数,如:var a = new Array(); a.construtor == Arrayproto...
2018-04-07 21:26:31
163
原创 js日常
1、undefined是未被申明的变量,或是已申明但未被赋值的变量,或并不存在的对象属性;null是无值,是一个空的对象,类似{} undefined == null undefined !== null undefined类型是undefined null的类型是Object JS中关于null、“”、undefined三者的具体区别?2、this对象是运行时基于...
2017-11-01 09:42:20
524
原创 canvas旋转
canvas旋转的两种方法:1、先用translate()将(0,0)坐标移动到想要旋转的中心点,再用rotate()旋转,最后要用translate()将中心移回(0,0)点。2、将要旋转的内容放在save()方法和restore()方法之间(类似于将两个方法里的绘制放在新的画布里),此方法也要用translate()方法移动(0,0)点,再用rotate()方法。注意:
2017-03-26 11:17:22
1833
转载 JavaScript 获取鼠标点击位置坐标
相对于屏幕如果是涉及到鼠标点击确定位置相对比较简单,获取到鼠标点击事件后,事件screenX,screenY获取的是点击位置相对于屏幕的左边距与上边距,不考虑iframe因素,不同浏览器下表现的还算一致。function getMousePos(event) { var e = event || window.event; return
2017-03-18 15:01:44
3396
转载 css背景图与html插入img的区别
1.写在css里面的图片是以背景图形式存在的,而写在html里的img是以标签形式存在的,在网页加载的过程中,以css背景图存在的图片会等到结构加载完成(网页的内容全部显示以后)才开始加载,而html里的img标签是网页结构(内容)的一部分会在加载结构的过程中加载。2.通常是非内容的图片就写在css里面(用来修饰页面的元素),如果是内容性的图片就写在html里面,打个比方,
2017-03-18 13:35:06
1006
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人