zoukankan      html  css  js  c++  java
  • vue学习笔记之初识vue——模板声明与绑定

    模板的存在的唯一目的,是为了和数据绑定。

    Vue.js在标准HTML语法基础上,增加了一些扩展的语法来声明数据的绑定。

    数据绑定语法

    在Vue.js的模板中,最常见的一种数据绑定语法,是使用模板引擎Mustache 的插值写法:{{}}。例如,下面的模板绑定了实例上下文中的name变量:

    <h1>{{name}}</h1>
    

    当Vue.js渲染此模板时,将使用实例数据上下文中的name变量值,来计算最终的 渲染结果。

    数据模型声明

    在创建Vue实例时,使用data配置项来声明Vue实例的数据模型。

    例如,下面的示例创建了一个具有初始模型{name:'Elthon John'}的Vue实例:

    var vm = new Vue({
      template:'<h1>{{name}}</h1>',
      data:{
        name:'Elton John'
      },
      el:'#app'
    })
    

    Vue.js根据data配置项声明的初始模型构造数据上下文,进而和template配置项 所声明的模板执行绑定,因此,上面示例的最终渲染结果是:<h1>Elton John</h1>

  • 相关阅读:
    ssh整合
    自定义Java集合
    java图形界面写个小桌面,内置简单小软件
    java简单日历
    javaSwing
    javaScript封装
    java解析xml文件
    缺省适配器
    适配器模式
    自定义SWT控件一之自定义单选下拉框
  • 原文地址:https://www.cnblogs.com/yi-515/p/8855063.html
Copyright © 2011-2022 走看看