3. vue常用指令

简介：展示vue的常用指令以及讲解使用场景

什么是指令

在vue中提供一些对于页面+数据的更为方便的操作，这些操作就叫做指令。
譬如在HTML页面中这样使用

在vue中v-xxx就是vue的指令
指令就是以数据去驱动DOM行为的,简化DOM操作

常用的指令和使用

v-text 不可解析html标签
v-html 可解析html标签
v-if /v-else-if/v-else(需和v-if相邻元素才能使用) 做元素的插入（append）和移除（remove）操作
v-show display:none 和display:block的切换
v-for
数组 : item，index
对象 : key，value ，index

 <div id="app"></div>
    <script type="text/javascript" src="vue.js"></script>
    <script type="text/javascript">
    new Vue({
        el:'#app',
        template:`
        <div>
            <div>模板内容1{{msg}}</div>
            <div v-text='mytext'></div>
            <div v-html='myhtml'></div>
            <div v-if='num==3'>FF</div>
            <div v-show='show'>FF</div>
            <li v-for='(item,index) in arrayFor'>{{item}}-{{index}}</li>
            <li v-for='(value,key) in objFor'>{{value}}-{{key}}</li>
        </div>
        `,
        data:function(){
            return {
                msg:'hellow',
                mytext:'<h1>fck</h1>',
                myhtml:'<h1>fck</h1>',
                flag:true,
                num:3,
                show:false,
                arrayFor:['A','B',"C"],
                objFor:{a:'A',b:'B'}

            }
        }

    })
    </script>