Vue小记（第一天）

引入Vue.js文件

<script src="https://cdn.jsdelivr.net/npm/vue"></script>

Vue指令

v-bind:title="message"

<span v-bind:title="message">悬停查看</span>

var app=new Vue({
    el:'#id',
    data:{
        message:'hello Vue'
    }
})

控制元素是否显示 v-if="seen"

值得注意的是，当seen：false的时候浏览器并不会渲染dom元素。

渲染列表v-for="todo in todos"

在控制台里，输入app.todos.push({text:'新项目'})，你会发现列表最后添加了一个新项目。

为了让用户和你的应用进行交互，我们可以用 v-on:"change" 指令添加一个事件监听器，通过它调用在 Vue 实例中定义的方法：

     点击之后   

这里可看出所有有关数据的都放在data里，方法放在methods里。

v-model="message"指令用来实现表单输入和应用状态之间的双向绑定：