Vue实例

作者: 云木杉 | 来源:发表于2019-03-27 17:40 被阅读0次

    Vue实例

    每个 Vue 应用都是通过用 Vue 函数创建一个新的 Vue 实例开始的:

    // 当创建一个 Vue 实例时,你可以传入一个选项对象。
    var vm = new Vue({
      // 选项
    })
    
    // 我们的数据对象
    var data = { a: 1 }
    
    // 该对象被加入到一个 Vue 实例中
    var vm = new Vue({
      data: data
    })
    
    // 获得这个实例上的属性
    // 返回源数据中对应的字段
    vm.a == data.a // => true
    
    // 设置属性也会影响到原始数据
    vm.a = 2
    data.a // => 2
    

    当这些数据改变时,视图会进行重渲染。值得注意的是只有当实例被创建时 data 中存在的属性才是响应式的。

    模板语法

    文本

    数据绑定最常见的形式就是使用“Mustache”语法 (双大括号) 的文本插值:

    <span>Message: {{ msg }}</span>
    

    Mustache 标签将会被替代为对应数据对象上 msg 属性的值。无论何时,绑定的数据对象上 msg 属性发生了改变,插值处的内容都会更新。

    通过使用 v-once 指令,你也能执行一次性地插值,当数据改变时,插值处的内容不会更新。但请留心这会影响到该节点上的其它数据绑定:

    <span v-once>这个将不会改变: {{ msg }}</span>
    

    相关文章

      网友评论

          本文标题:Vue实例

          本文链接:https://www.haomeiwen.com/subject/diyzvqtx.html