现在我想在页面上的某个元素上动态的显示一些数据,也就是数据有变化的时候,可以立即的显示出有变化的数据。在这个 html 文档里面,先添加一个 div 上面加上一个 id ... 一会儿我们会用到这个 id 把数据绑定到这个元素里面 ..
然后再用一个模板 .. 两组大括号 ... 中间加上一个 message ,这个 message 就是应用里的某个属性的名字 .. 再打开页面上嵌入的 index.js 这个脚本文件 ..
创建一个应用,名字是 app ,新建一个 Vue 的实例 ... 给它提供一些参数 ... 添加一个 el,指定一下应用绑定到的元素 ... 这里就是带 app 这个 id 的元素 ..
再添加一个 data ... 它是一个对象 .. 它是应用里提供的一些数据 .. 添加一个 message 属性,它的值先设置成 hello ..
在浏览器上你会看到,页面上的这个带 app id 的元素里面,会显示 message 属性的值,就是这个 hello ..
打开浏览器的 Console ... 看一下 app 的 message 属性的值 ... 现在是 hello .. 我们可以再设置一下它的值 ... 让它等于 hola ...
你会看到,页面上显示的内容会立即变成刚才我们设置的这个内容 ...