vuex的基础内容

vuex
定义：全局状态管理器，全局数据共享。
特点：数据双向响应,数据流向是单向的【自上而下，从父级传到子级的过程，并且子级不可以修改父级的数据】
缺点：数据存在内存中，刷新页面会丢失改变的状态值，需要使用持久化插件把数据存在本地，

vuex-persist
vue2的vuex和vuex没有半点更改。只有初始化的语法略有改动。

差异
1.由createS tore函数创建store实例
2.组件内使用store使用useStore高阶函数得到store对象

持久化插件
veux-persister

vue3代码的组件内抽离优化【组件瘦身】
可以抽离数据和方法到外部js中，但是对于props，store，生命周期和router的初始化不可以抽离。

组件通信
1.父传子，子组件使用defineProps函数接收
2.子传父，子组件使用definemits函数接收
3.v-model升级可以绑定多个
4.子组件向父组件主动暴露数据，使用defineExpose函数

vue-router
语法没有变化，只是初始化的时候需要使用createRounter创建路由实例,mode项变成了history,并且使用
createWebHistory方法初始化。

组件内获取路由实例使用useRouter函数初始化
组件内获取当前路由对象useRoute函数初始化

teleport   vue3新增的的内置组件，，可以将包裹的元素挂载到指定的任意元素中去，从而脱离当前组件的文档位置，但是作用域还有数据等还是使用的当前组件

虚拟dom和diff算法
1.虚拟dom就是通过diff算法对Js生产的dom计算得来的，它并不是真实的dom节点，是js生成的
2.diff算法：递归+对比计算，新旧dom对比，同级对比，发现由不一样的地方，直接用新的替换旧的。

h()  创建虚拟dom
<div  id  classs>1234</div>
{
type:'div',
props: [ 'id' , 'class'],
children: '123' or
children: { type:' p ' }  or [ { } , { } ]
}
语法：h('标签类型'，{id:"",class:"",/*innerHTML*/},[children])