vue3学习笔记

学习非一日之寒,相信量变会引起质变.

一,计算属性跟监视

let user=reactive({

　　firstname:"东方",

　　lastname:"不败",

})

1.computed计算属性 如果只传入一个回调函数,表示get方式 返回的是ref类型的对象

   computed计算属性,传入对象computed计算属性({

  get (){  },

  set (val) {  }

})

2.watch监视,监事指定的数据 watch可以监视多个数据,使用[],当使用watch监听非响应式数据时要使用回调[()=>user.firstname,()=>user.lastname]

watch(user,(val)=>{

},{

  immediate:true,//当前的watch默认的会执行一次

  deep:true,//如果user中,层次很深.用deep,深度监视.

})

3.watchEffect(()=>{

  fullname.value=user.fistname+user.lasename,//不需要配置immidiate默认会执行一次

})

二,生命周期

 

 vue2中的生命周期在options中但是vue3中在组合api中

 

三,toRefs的使用.

　　toRefs可以把一个响应书数据转变为普通对象,该普通对象的每一个property都有一个ref

　　ref获取元素

　　

 

 四.composition API其他部分

　　1.shallowReactive与shallowRef

　　都是浅响应式.(浅劫持)

　　2.readonly和shallReadonly一个为深度只读,一个为浅只读(深层可以修改)

　　3..toRaw和markRaw

　　toRaw把代理对象转成普通对象.数据变化,界面不变化

　　markRaw标记的对象数据,从此以后都不能成为代理对象了.

　　4.实现跨层级组件间通信的用provide跟inject

五.新组建

 　　fragment 组件没有跟标签，内部会讲多个标签包含在一个fragment虚拟元素中,好处减少层次,减少内存占用

　　Teleport(瞬移) 组件

　　suspense

 

 `