您的位置:首页 > 产品设计 > UI/UE

vue.js入门之我见

2016-09-07 14:02 555 查看
敲代码的是从hello world开始,那么我们就先写一个hello world

<div id="app">
{{ message }}
</div>
new Vue({
el: '#app',
data: {
message: 'Hello Vue.js!'
}
})
然后就是一个入门常用的api
循环数据,之前有过开发php的基础,所以先从数据循环说起:

v-for

<span style="white-space:pre"> </span><div id="app">
<li v-for="messages in message">
{{messages}}
</li>
</div>基本上格式是v-for="xxs in xx" 形式,前面的xxs是自己命名的一个变量,用于html引用,后面的xx则是js传过来的数据。
<script>
new Vue({ el: '#app', data: { message: 'Hello Vue.js!' } })
</script>v-model
对于双向数据绑定,这个是所有mvvm里面的基础,简单的一个demo

<div id="app">
<p>{{ message }}</p>
<input v-model="message">
</div>
new Vue({
el: '#app',
data: {
message: 'Hello world!'
}
})


刚开始学习vue,算是学习笔记把。总结一些以便将来查看。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  vue.js