Vue简单指令

1.v-bind 用于属性绑定

<div id="app">
  <div v-bind:id="message">文字</div>
</div>

<script>
new Vue({
  el: '#app',
  data: {
    massage: 'hello world'
  }
})
</script>

• 该结果为 hello world

2.v-model 用于双向绑定

<div id= "app">
            <input type="text"  v-model="name" placeholder="请输入" />
            <h2>你好，{{name}}</h2>
            </div>
            <script type= "text/javascript">
                var app =new Vue({
                    el:'#app',
                    data:{
                        name:'',
                    }
                })
            </script>

3.v-if

<a v-if="ok">yes</a>

• 如果属性值ok为true，则显示。否则，不会渲染这个元素

4.v-else

<a v-if="ok">yes</a>
<a v-else>No</a>

• v-else是搭配v-if使用的，它必须紧跟在v-if或者v-else-if后面，否则不起作用。