vue js入门_综合

1、初步使用，引入node.js文件即可。

引入数据与DOM绑定。

<div id="app">{
   { message }}
</div>
<script>
var app = new Vue({ //每个vue.js的应用起步都是通过构造函数Vue创建一个vue的根实例

  el: '#app',data: {message: 'Hello Vue!'}
})
</script>

2、指令：带有前缀v-,表示它们是vue提供的特殊属性。职责：当其表达式的值改变时，相应的将某些行为应用到DOM上。

插值：

文本：{ {msg}} mustache语法,绑定数据上的msg属性发生改变，此处内容也会更新。

   <p>{
   {msg}}</p>

v-once指令，进行一次性赋值，数据改变时，插值处的值不会改变。

          <p v-once>{
   {msg}}</p>

纯html：v-html=""。注意：你的站点上动态渲染的任意 HTML 可能会非常危险，因为它很容易导致 XSS 攻击。请只对可信内容使用 HTML 插值，绝不要对用户提供的内容插值。

属性：v-bind:id=" " ,v-bind:disabled=" ",v-bind:title=" "，v-bind:href=" "

修饰符：以半角句号.指明特殊的后缀，指出一个指令应该以特殊方式绑定。

条件与循环：v-if="seen" 在data里面设置seen的值为true或者false。

v-for="todo in todos" 里面的todos为data里面的数据。 { {todo.name}}

3、修改数据：app.key="新消息"；

添加数据：如果key是一个数组 app.key.push({name:'新项目'});