Vue学习 开始走向VUE开发2---插值使用详解





Value1 is {{name}}

Value2 is {{value}}







设计思路

变量value是在window作用域下的全局变量,vm也是在全局作用域下的Vue对象的实例。有两个块用于显示vm实例中data属性中的name的值和全局变量value的值。有一个button按钮每点击一下name的值和value的值将会做加一的操作。

结果

(1)在浏览器上打开此网页,如图显示,显示的是当前value和name的值都是0


Vue学习 开始走向VUE开发2---插值使用详解

(2)点击button多次之后,看到显示的name的值和value的值都是 9,在控制台查看value的值也是9。可见Vue使用插值的方法不仅仅可以跟踪Vue实例中的值的变化还可以跟踪非此实例中的值的变化。


Vue学习 开始走向VUE开发2---插值使用详解


Vue学习 开始走向VUE开发2---插值使用详解


分享到:


相關文章: