![](https://img-blog.csdnimg.cn/20201014180756780.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
文章平均质量分 54
vue
雨辰389
这个作者很懒,什么都没留下…
展开
-
vuex详解
vuex详解原创 2022-11-03 17:39:41 · 302 阅读 · 1 评论 -
Vue项目优化内容:
①尽量减少data中的数据,data中的数据都会增加getter和setter,会收集对应的watcher v-if和v-for不能连用 v-if 和 v-show 区分使用场景 v-for 遍历必须加 key,key 最好是 id 值,且避免同时使用 v-if 如果需要使用v-for给每项元素绑定事件时使用事件代理。⑩PWA 还可以使用缓存(客户端缓存、服务端缓存)优化、服务端开启gzip压缩等。②SPA 页面采用keep-alive缓存组件 在更多的情况下,使用v-if替代v-show。原创 2023-03-23 09:38:02 · 56 阅读 · 0 评论 -
Vue是如何实现双向绑定的?
vue实现数据双向绑定主要是:采用数据劫持结合发布者-订阅者模式的方式,通过 Object.defineProperty() 来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应监听回调。当把一个普通 Javascript 对象传给 Vue实例来作为它的 data选项时,Vue将遍历它的属性,用Object.defineProperty()将它们转为getter/setter。用户看不到getter/setter,但是在内部它们让Vue追踪依赖,在属性被访问和修改时通知变化。原创 2023-02-16 09:35:02 · 143 阅读 · 0 评论 -
Vue-Router怎么使用?
vue-router的详细内容原创 2022-11-08 11:59:04 · 642 阅读 · 0 评论 -
vue生命周期之间的差别
vue响应式的改变一个值以后,此时的dom并不会立即更新,如果需要在数据改变以后立即通过dom做一些操作,可以使用$nextTick获得更新后的dom。该钩子被调用后,对应 Vue 实例的所有指令都被解绑,所有.的事件监听器被移除,所有的子实例也都被销毁。$nextTick 是在下次 DOM 更新循环结束之后执行延迟回调,在修改数据之后使用 $nextTick,则可以在回调中获取更新后的 DOM。mounted(挂载后)挂载完成,HTML已经被渲染到了页面上,这个阶段可以执行dom操作,可以进行数据请求。原创 2023-03-21 09:11:36 · 70 阅读 · 0 评论 -
vue3生命周期
状态触发,同样是vue3新引入的钩子函数,只有在开发环境有效,与onRenderTracked的效果类似,但不会跟踪所有的响应式变量方法,只会定点追踪发生改变的数据,同样返回一个event对象。,状态跟踪,vue3新引入的钩子函数,只有在开发环境有用,用于跟踪所有响应式变量和方法,一旦页面有update,就会跟踪他们并返回一个event对象。,与keep-alive一起使用,当keep-alive包裹的组件激活时调用。,数据更新后调用,此时内存数据已经修改,页面数据也已经更新。,卸载组件实例后调用。原创 2022-11-18 14:52:14 · 1688 阅读 · 0 评论