vue3 父子组件传值

export default {
  props: {
    msg: String
  },
  setup (props) {
    const { msg } = props
    console.log(msg);
    const count = ref(0)
    return {
      count,
    }
  }
}

首先通过props 获取参数,然后在setup 的 props中获取参数

vue3 watch的问题

监听reactive的时候 无法正确获得oldvalue 如果获取obj的属性 可以使用监听 ()⇒obj.a 这样是可以获取正确的oldvalue

当时疑惑:()⇒obj 这样 发现watch无法工作 监听不到

vue 计算属性 + watch

计算属性注重属性 我所需要的属性依赖哪些其他属性

watch类似 react useeffct 监视某个数据改变 调用某个函数 最佳方案-页面修改 调用更新函数

vue 生命周期

之前一直疑惑 卸载的钩子 想不到哪里用得上 看完视频发现:v-if 隐藏的时候会触发 卸载钩子

vue toRef toRefs

对象展开 方便调用

const obj = reactive({
      a: 1,
      b: 'a',
    })

const { a, b } = toRefs(obj)

这样 直接调用a b也可以

Teleport组件

<Teleport to='body'><div>123</div><Teleport>

可以自选这个里面的代码渲染到哪里 比较适合做模态框(dialog)

今日总结

  • [x] 学习学习

培训项目完成,下午 下午茶。 然后看b站vue3视频 基本看完 学了点东西