随笔分类 -  vue3

vue3中watch的写法大合集。
摘要：VUE2的watch是一个属性写法是 watch:{ data1(newVal,oldVal){ 同步/异步操作 } } VUE3的watch则是一个函数，写法是 注意数据必须是响应式的 let num = ref(0) //watch(要监听的响应式数据,(新值，旧值)=>{更新时的回调}) wa 阅读全文
posted @ 2023-03-28 10:46 SadicZhou 阅读(1486) 评论(0) 推荐(0)
vue3_05使用reactive来处理复杂数据
摘要：vue3中除了提供了ref函数以为还提供了reactive函数来操作数据，一般情况下我们使用ref函数来操作简单类型数据，reactive函数来操作复杂类型数据 <template> <div>{{objRet.name}}</div> </template> <script lang="ts"> 阅读全文
posted @ 2022-12-27 12:33 SadicZhou 阅读(340) 评论(0) 推荐(0)
vue3_04ref获取标签
摘要：ref也可以用来获取dom节点 分为三步： 1.给节点绑定ref='xxx' 2.let xxx =ref() 3.在挂载之后直接使用即可 <template> <div ref="op">24</div> <p>{{ num }}</p> <button @click="add">点击</butt 阅读全文
posted @ 2022-12-27 11:59 SadicZhou 阅读(131) 评论(0) 推荐(0)
vue3_03ref操作复杂类型
摘要：ref也可以将复杂类型的数据转换为响应式数据，使用方法和处理简单类型数据一样 let a =ref(复杂类型数据) a.value.xxx <template> <p>{{ objref.num }}</p> <button @click="add"></button> </template> <s 阅读全文
posted @ 2022-12-27 11:57 SadicZhou 阅读(247) 评论(0) 推荐(0)
vue3_02ref操作简单类型
摘要：vue3中提供了ref()函数可以把数据转换为响应式数据。 <template> <div> {{ num }} </div> <button @click="add">这是按钮</button> </template> <script lang="ts"> import { defineCompo 阅读全文
posted @ 2022-12-27 11:54 SadicZhou 阅读(114) 评论(0) 推荐(0)
关于Vue3 can not find module的报错
摘要：最近在做Vue3项目的时候，会看到这样一个报错，找不到模块 .vue文件，可能是ts文件无法识别vue后缀的文件导致的，上网搜索了一下发现尤大大给出了解决方案。 在src目录下新建一个.d.ts后缀的文件 declare module '*vue'{ import {ConponmentOption 阅读全文
posted @ 2022-12-27 10:34 SadicZhou 阅读(60) 评论(0) 推荐(0)
vue3_01生命周期函数
摘要：<template> <div> <p>这是第一个组件</p> </div> </template> <script lang="ts"> import { defineComponent, onBeforeMount, onMounted } from 'vue'; export default 阅读全文
posted @ 2022-12-26 22:39 SadicZhou 阅读(44) 评论(0) 推荐(0)