1、在接触Vue 之应该明白三个名称:挂载点,模板,实例
先写一个Vue实例吧
new Vue({ el:'#root', template:'<h1>{{ms}}</h1>', data:{ msg:"hellow world", } })
上述整体来看,可以看作是一个实例。
挂载点:上面的“el”就可以看作是一个挂载点。其挂在id为root的标签上
模板:其中的template就是模板,对于父类的实例来看,可以不写模板,但是也可以将挂载点的内容如上写在模板里
2、接着要明白几个常用的语法内容了
v-text:书写格式为 <div v-text=“msg”></div>
v-html:书写格式为 <div v-html="msg"></div>
上面两种方法都可以将我们的内容成功的输出,差别在于如果msg中写了代码是如何的情况
v-text会将代码转义,也就是原封不动的将代码也输出,v-html则相反
v-on:clikck=“handleClick”
这是事件绑定的方法 ,同时也可以简写为 @click="handleClick"
v-bind是对于数据的绑定,同时可以简写为 :
v-model对于数据的双向绑定,目前无简写
3、计算属性以及监听器
computed:{ fullname:function () { return this.first+" "+this.last; } },
上面的computed需要写在实例中
watch:{ fullname:function () { this.count++; } }
这个是监听器,
上诉代码的意思是,如果fullname发生变化,count的数据将会增加