Vue模板语法

1.基本模板语法,可以使用{{}}来进行渲染

<div id="app">  <!--app为实例el的属性-->
   {{text}}
</div>

<script>
   var vm = new Vue({
     el:"#app",
     data:{
       text:"这是一段呗渲染到HTML中的数据"
     }
   })
</script>

2.插值v-html

   因为{{}}只能解析纯文本的形式，所以要解析非纯文本形式的话就需要用到v-html来进行解析html

<div id="app">
   <div v-html="messgae"></div>
   <p>您好:{{name}}</p>
</div>

<script>
   new Vue({
      el:"#app",
      data:{
        message:'用户名<input type="text" value="姓名" />'+'密码<input type="password"/>'
     }
   })
</script>

3.表达式

Vue支持所有JavaScript的所有表达式

1. {{ number +  1 }}
2. {{ ok？‘yes’ ：‘no’ }}
3. {{ message.split('').reverse().join('') }}
4. <div v-bind:id="'list-'" + id></div>