vue3|vue3 setup语法糖中组件之间通讯以及vuex的使用以及数据监听,路由跳转传参等基础知识点

如果你看了上一关于3.2项目的搭建,看看玩这篇这些常用的知识点,那基本可以进入项目实战
上一篇vue3.2系统搭建
【vue3|vue3 setup语法糖中组件之间通讯以及vuex的使用以及数据监听,路由跳转传参等基础知识点】vue 从2到三的变化,其实只有很小的差别,可能就是你写习惯2,现在来写3,有那么一点不习惯而已。
在我们日常开发过程中,常用的知识点
1路由的跳转传参
2组件通讯
3.vuex状态管理
4.数据监听
等等,其他的就是一些数据处理,数据的组装

1.路由的跳转传参 使用
//l路由引入 import { useRoute, useRouter } from "vue-router"; const router = useRouter(); //其他页面接受方式当然你也可以是params的方式

2组件通讯
//父组件nter; } >

//子组件

其实记住 defineProps接收, defineEmits用来发送
3.vuex状态管理
这个莫非也就是 取数据,修改数据的问题,
import { createStore } from 'vuex' const store = createStore({ state: { userInfo: { name:'weblzr' } }, mutations: {sername(state, name){ state.userInfo.name = name } }, actions: {}, getters: {} }) export default store

比如我们需要使用name ,在对应vue文件中
直接取值 {{$store.state.userInfo.name}}

修改
修改vuex名字

或者使用 dispatch操作 actions 来改变数据,不依依说,
这边文章写的很详细,模块拆分,辅助函数等等
vuex进阶传送门
修改数据监听取值
监听值取值 {{name}}

也可以使用computed结合watch 来监听数据变化
computed watch 来监听数据变化
至于其他知识点不依依细说,大同小异而已,掌握基本的基本够用。

    推荐阅读