vue3的小使用技巧

vue3的小使用技巧

最重要的一般我们定义数据的时候要末使用ref， 要末使用reactive，直接定义的只有方法，因为数据需要实时渲染，定义方法常用const ，数据用let 防止报错
Uncaught TypeError: Assignment to constant variable. 报错原因就是因为const 定义数据是定量后期不能修改 ，这个错犯的频率有点高就记录一下

1.1传送门teleport

<div>
    <button @click="modelOpen = true">弹出框</button>
    <teleport to="body"> 
      <div v-if="modelOpen">
        <div>我是弹出的1</div>
        <button @click="modelOpen =false">关闭</button>
      </div>
    </teleport>
  </div>

to 挂载在哪里放在盒子的内部最后面

1.2数据监听watch

数据监听这里可以监听多个
第一个参数是监听的属性值 第二个是个回调函数，里面参数分别是新值旧值

如果是监听reactive中的数据第一个参数必须要以回调的形式