怎么设置自己做的网站吗,项目进度管理,网站pc和手机端分离怎么做,产品外包装设计网站watach函数#xff1a; 与vue2.x的配置功能一致 监视指定的一个或多个响应式数据, 一旦数据变化, 就自动执行监视回调
默认初始时不执行回调, 但可以通过配置immediate为true, 来指定初始时立即执行第一次
通过配置deep为true, 来指定深度监视
watchEffect函数#xff1a;…watach函数 与vue2.x的配置功能一致 监视指定的一个或多个响应式数据, 一旦数据变化, 就自动执行监视回调
默认初始时不执行回调, 但可以通过配置immediate为true, 来指定初始时立即执行第一次
通过配置deep为true, 来指定深度监视
watchEffect函数
不用直接指定要监视的数据, 回调函数中使用的哪些响应式数据就监视哪些响应式数据 默认初始时就会执行第一次, 从而可以收集需要监视的数据 监视数据发生变化时回调
watchEffect 是不支持 deep 参数的也就是说它不会对数据进行深度监听。 watchEffect 中的回调函数只会监听使用到的响应式数据的变化 如果这些响应式数据是对象或数组只有它们的引用发生变化时才会触发回调函数执行。
templatediv stylefont-size: 14px;h2测试watch监视 和 watchEffect/h2fistName: input v-modeluser.firstName/brlastName: input v-modeluser.lastName/brfullName3: input v-modelfullName3brfullName4: input v-modelfullName3br/div
/templatescript langts
// vue3.0 版本语法
import {defineComponent,reactive,ref,watch,watchEffect
} from vueexport default defineComponent({setup () {const user reactive({firstName: 张,lastName: 三})const fullName3 ref()const fullName4 ref()/* watchEffect: 监视所有回调中使用的数据*/watchEffect(() {console.log(watchEffect)fullName4.value user.firstName - user.lastName}) /* 使用watch的2个特性:深度监视初始化立即执行*/watch(user, () {fullName3.value user.firstName - user.lastName}, {immediate: true, // 是否初始化立即执行一次, 默认是falsedeep: true, // 是否是深度监视, 默认是false})/* watch一个数据默认在数据发生改变时执行回调*/watch(fullName3, (value) {console.log(watch)const names value.split(-)user.firstName names[0]user.lastName names[1]})/* watch多个数据: 使用数组来指定如果是ref对象, 直接指定如果是reactive对象中的属性, 必须通过函数来指定*/watch([() user.firstName, () user.lastName, fullName3], (values) {console.log(监视多个数据, values)})return {user,fullName3,fullName4}}
})
/script
初始页面效果执行了一次watchEffect 在fistName输入了大字后页面效果 再在lastName输入了丰字后页面效果 欢迎关注我的原创文章小伙伴们我是一名热衷于前端开发的作者致力于分享我的知识和经验帮助其他学习前端的小伙伴们。在我的文章中你将会找到大量关于前端开发的精彩内容。
学习前端技术是现代互联网时代中非常重要的一项技能。无论你是想成为一名专业的前端工程师还是仅仅对前端开发感兴趣我的文章将能为你提供宝贵的指导和知识。
在我的文章中你将会学到如何使用HTML、CSS和JavaScript创建精美的网页。我将深入讲解每个语言的基础知识并提供一些实用技巧和最佳实践。无论你是初学者还是有一定经验的开发者我的文章都能够满足你的学习需求。
此外我还会分享一些关于前端开发的最新动态和行业趋势。互联网技术在不断发展新的框架和工具层出不穷。通过我的文章你将会了解到最新的前端技术趋势并了解如何应对这些变化。
我深知学习前端不易因此我将尽力以简洁明了的方式解释复杂的概念并提供一些易于理解的实例和案例。我希望我的文章能够帮助你更快地理解前端开发并提升你的技能。
如果你想了解更多关于前端开发的内容不妨关注我的原创文章。我会不定期更新为你带来最新的前端技术和知识。感谢你的关注和支持我们一起探讨交流技术共同进步期待与你一同探索前端开发的奇妙世界
