![](https://img-blog.csdnimg.cn/20201014180756780.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue3
Vue3
生产队的驴.
这个作者很懒,什么都没留下…
展开
-
Vue3 Pinia结构化赋值storeToRefs 解决响应式丢失 保持响应式
正常情况下需要这样去获取或者调用完方法,这都需要通过userStore.xxx去获取,有时候想直接通过方法名去使用。storeToRefs只负责数据的相关处理,如是方法就会失效。这样就不用去userStore.xxx去获取数据。可以使用结构化赋值,但是这样失去了响应式。使用storeToRefs。原创 2024-07-28 20:33:05 · 227 阅读 · 0 评论 -
Vue3 Pinia的创建与使用代替Vuex 全局数据共享 同步异步
提供跨组件和页面的共享状态能力,作为Vuex的替代品,专为Vue3设计的状态管理库。Vuex:在Vuex中,更改状态必须通过Mutation或Action完成,手动触发更新。Pinia:Pinia的状态是响应式的,当状态发生变化时,组件会自动更新,无需手动触发。官方文档 :https://pinia.vuejs.org/zh/getting-started.html使用Pinia对用户的登录信息进行保存目录结构:src/store/user.js//导入pinia//user表示模块名。原创 2024-07-28 20:10:07 · 467 阅读 · 0 评论 -
Vue3 父传子props双向数据绑定 defineProps 和 defineModel
传递不修改:defineProps (只读)传递并修改:defineModel (Vue>3.4)可以根据自己的需求去选择文档:https://cn.vuejs.org/api/sfc-script-setup.html#definemodel。原创 2024-07-16 21:17:22 · 374 阅读 · 0 评论 -
Vue3 子组件像父组件传递数据 自定义事件 defineEmits
很多情况下子组件都需要像父组件去传递一些数据,Vue3和Vue2传递值的写法不太一样。原创 2024-07-16 21:03:39 · 439 阅读 · 0 评论 -
Vue3 组件向下通信 祖孙组件的通信 provide与inject
当父子间通信可以使用props,祖孙使用provide(传递)或inject(接收),这时不管组件套的多深都可以向下传递。原创 2024-07-16 14:46:37 · 598 阅读 · 0 评论 -
Vue3 使用Vite构建项目
Webpack在启动开发服务器时需要先打包整个应用,这个过程可能包括语法解析、依赖收集、代码转译、打包合并和代码优化等步骤,这些操作通常会导致启动缓慢。而Vite则采用了一种“按需编译”的方式,它基于原生ES模块(ESM)工作,只处理被浏览器实际请求的模块,从而大大缩短了启动时间。官方文档:https://vitejs.cn/vite3-cn/guide/原创 2024-07-12 13:09:35 · 430 阅读 · 0 评论 -
Vue3 watch与watchEffect的区别
watch监听指定的变量,变量发生变化时才触发回调。只监视自己所用到的变量,更注重执行过程。初始化时也会执行一次,无需额外配置。原创 2024-07-12 09:34:28 · 469 阅读 · 0 评论 -
Vue3 和Vue2区别简介
性能优化Vue2:Vue2性能相对优化空间较大,特别是在大型应用中虚拟DOM的渲染和组件初始化等方面。Vue3:Vue3重写了虚拟DOM的实现,并优化了编译模板和组件初始化过程,使得更新性能提高1.3至2倍,SSR速度提高了2至3倍。生命周期钩子Vue2:在Vue2中,生命周期钩子包括beforeCreate, created, beforeMount, mounted等。这些钩子直接在选项API中定义和使用。原创 2024-07-11 09:17:23 · 317 阅读 · 0 评论