Vue——html中的基本语法

引入Vue JS文件，创建Vue实例

new Vue({
        el: '.container',//挂载实例
        data: {
            first: '初次使用Vue',
            arr: ['第一个', '第二个', '第三个'],
            show: true,
            text: '
我是H1标签啊
',
            className: 'active',
            isActive: true
        }
    })

1、v-model  （数据双向绑定，运用于form表单标签）

2、v-for  （循环，如果循环的是数组，i 值为数组的下标，如果循环的是对象，则 i 值为对象的key值，不管循环是数组还是对象，k 值都是 value，此处需要区别原生 JavaScript 的 in 关键字，在vue中，被循环的还可以是数字）

{{i}},{{k}}

3、v-show  （显示隐藏，不会从DOM中移除，display:none）

写点东西吧

4、v-if  （显示隐藏，从DOM中移除）

写点东西吧

5、v-bind  （给标签属性添加变量，如果在属性值的引号里面再添加一层引号则为字符串形式，如果是一个数组，数组中的值为字符串，就会直接把value遍历出来，添加到属性的值中，可以简写为一个冒号  :  ）

  //传入多个类名时使用数组，v-bind:class="{ active:true }"传入单个类名

6、v-on  （绑定事件，可以简写为 @ ，在标签中，如果没有传参的话，可以在方法中的第一个参数就是event事件，如果在方法中传参了，那么可以使用 $event来表示，该参数为event事件）

DIV显示隐藏切换
DIV显示隐藏切换

7、v-text  （类似于innerText），标签内的内容将不会展示，只会展示使用v-text绑定的变量（v-html也一样）

{{text}}

8、v-html  （类似innerHtml）

{{text}}