Vue9.2天气案例_监视属性

<!DOCTYPE html>>
<html><head><title>天气案例_监视属性</title><meta charset="UTF-8" /><!-- 引入Vue --><script type="text/javascript" src="../js/vue.js"></script></head><body><!--监视属性watch：1.当被监视的属性变化时，回调函数自动调用，进行相关操作2.监视的属性必须存在，才能进行监视3.监视的两种写法：（1）new Vue时传入watch配置（2）通过vm.$watch监视--><!-- 准备好一个容器 --><div id="root"><h2>今天天气很{{info}}</h2><button @click="changeWeather">切换天气</button></div></body><script type="text/javascript">Vue.config.productionTip = falseconst vm = new Vue({el:'#root',data:{isHot:true},computed:{info(){return this.isHot ? '炎热' : '凉爽'}},methods: {changeWeather(){this.isHot = !this.isHot}},/*watch:{isHot:{//handler什么时候调用？当isHot发生改变时调用。handler(newvalue,oldvalue){console.log('isHot被修改了',newvalue,oldvalue)}}}*/})vm.$watch('isHot',{immediate:true, //初始化时让handler调用一下handler(newvalue,oldvalue){console.log('isHot被修改了',newvalue,oldvalue)}})</script>
</html>

Vue9.2天气案例_监视属性相关推荐

11.监视属性——watch
一.监视属性watch 1.当被监视的属性变化时,回调函数自动调用,进行相关操作 2.监视的属性必须存在,才能进行监视 3.监视的两种写法 (1)new Vue时传入watch配置 (2)通过vm.$ ...
Vue学习_计算属性
实现姓名案例: 1.插值语法实现姓名案例直接从vm中读取. <!doctype html> <html lang="en" xmlns:v-model=&quo ...
Vue 监视属性 watch
<!--监视属性 watch:1. 当被监视的属性变化时,回调函数自动调用,进行相关操作2. 监视的属性必须存在,才能进行监视3. 监视的两种写法:(1). new Vue 时传入 watch ...
【Excel】绘图案例_常见复合图：簇状图+堆积图+折线图
[Excel]绘图案例_常见复合图:簇状图+堆积图+折线图前言最近有朋友让我帮忙用excel画图,老实说我很讨厌用excel画图,点来点去,复杂一些还不能复用,非常繁琐.当然,入门也很简单.需求时 ...
Android Studio基础_学校课程案例_笔记
移动应用课程案例_笔记开发环境搭建 Android Studio Genymotion 模拟器案例飞机大战三个控件密码与用户登录五个按钮桌面台球-帧布局用户登录-表格布局图片-线性布局 ...
【初阶】unity3d官方案例_太空射击SpacingShooter 学习笔记显示分数时，如何让函数之间相互交流...
[初阶]unity3d官方案例_太空射击SpacingShooter 学习笔记显示分数时,如何让函数之间相互交流一.关于显示分数时,如何让函数之间相互交流这是一个非常好的逻辑问题 1 思路:主 ...
『TensorFlow』函数查询列表_张量属性调整
博客园首页新随笔新文章联系订阅管理『TensorFlow』函数查询列表_张量属性调整数据类型转换Casting 操作描述 tf.string_to_number (string_te ...
Bootstrap学习笔记02【全局CSS样式、组件和插件、案例_黑马旅游网_首页】
Java后端学习路线笔记汇总表[黑马程序员] Bootstrap学习笔记01[快速入门.栅格布局][day01] Bootstrap学习笔记02[全局CSS样式.组件和插件.案例_黑马旅游网][d ...
Vue学习之监视属性watch
简介设置监视属性的作用: 当被监视的属性发生变化时,回调函数会自动调用,进行相关操作. 监视的熟悉必须存在,才能进行监视. 使用vue的配置对象中的watch属性进行配置. <!DOCTYPE ...

Vue9.2天气案例_监视属性

Vue9.2天气案例_监视属性相关推荐

最新文章

热门文章