码迷,mamicode.com
首页 > 其他好文 > 详细

第一节数据绑定

时间:2016-11-19 23:49:30      阅读:184      评论:0      收藏:0      [点我收藏+]

标签:配置   指令   div   格式   span   实现   空格   函数   case   

1、文本插值的方法:Mustache语法,{{msg}}。

  例如:<span>{{msg}}</span>。

  • 当只需要渲染一次的时候,用*来实现:<span>{{*msg}}</span>
  • 当值是html片段的时候,可以用三个大括号来绑定:msg:"<span>name</span>"  ;    <span>{{{msg}}}</span>
  • 可以绑定标签的属性:<li data-id="{{msg}}"></li>

2、表达式的使用:

  js表达式:{{ msg / 100 }}     ,      {{ true ? 1 : 0 }}

      表达式后面接过滤符:  

      {{ example | toUpperCase}}  , toUpperCase是一个过滤器,是js函数。

      {{ example | toUpperCase | filter }}  ,两个过滤器串联,都要满足。

                 {{ example | filter a b }}  ,a b为过滤器参数,用空格隔开

3、指令:是指带有v-前缀的特殊的表达式。指令的最用是当表达式的值变化时,也反映到DOM上。

  例如:<div v-if="show">DDEE</div>

               <div v-on:click="action"></div>

4、分隔符

  Vue.config 是一个配置对象,包含了Vue.js的所有的全局的配置。

      源码:

    let delimiters = [‘{{‘,‘}}‘]

      let unsafeDelimiters = [‘{{{‘,‘}}}‘]

 

   在Vue实例化之前修改其中的属性:

    Vue.config.delimiters = ["<%","%>"]    //文本插值

           Vue.config.unsafeDelimiters = ["<$","$>"]   //html格式的文本

 

第一节数据绑定

标签:配置   指令   div   格式   span   实现   空格   函数   case   

原文地址:http://www.cnblogs.com/shannonliang/p/6081643.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!