- 什么是Vue?我認(rèn)為它是一個(gè)通過類似于json的東西來操作html界面的這么一個(gè)框架。
- jQuery我一直認(rèn)為是個(gè)庫，它無非是把js簡(jiǎn)寫了，特別在dom操作上，讓你感覺到$布滿了代碼世界，我不否認(rèn)它的好，再好它也只是把js簡(jiǎn)寫而已。
- 而vue是帶著我們從另一個(gè)面去看網(wǎng)頁設(shè)計(jì)，它弱化了dom上的感覺，加強(qiáng)了html界面上的操作。
一、 我們開始去認(rèn)識(shí)Vue吧，為了便于學(xué)習(xí)，我們還是用鏈接網(wǎng)絡(luò)上的vue.js形式去學(xué)習(xí)吧。
二、創(chuàng)建一個(gè)盒子box等下我們就用vue對(duì)它進(jìn)行操作。
三、這就是一個(gè)簡(jiǎn)單的vue構(gòu)造。
四、我們把vue捆綁到html元素中。
五、試著對(duì)html界面進(jìn)行修改。
六、數(shù)據(jù)不僅可以一個(gè)，也可多個(gè)，怎么樣，感覺和js的取得dom對(duì)象再進(jìn)行innerHTML操作相比，讓你幾乎感受不到了DOM的存在。
七、除了可以放數(shù)據(jù)，還可以放函數(shù)事件。
八、我們做個(gè)簡(jiǎn)單的返回?cái)?shù)據(jù)的函數(shù)吧。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://cdn.staticfile.org/vue/2.4.2/vue.min.js"></script>
</head>
<body>
<div class="box">
<!-- 創(chuàng)建一個(gè)容器box，它就是我們等下的操作對(duì)象 -->
<p>{{text1}}</p>
<p>{{text2}}</p>
<p>{{myfun()}}</p>
</div>
<script>
var myvue = new Vue({
// 我在這里聲明了一個(gè)vue對(duì)象，我們就是在這里對(duì)html進(jìn)行操作
el:'.box',
// myvue就捆綁到了box上，以后box的操作就可以在這里進(jìn)行了
// 注意vue內(nèi)各項(xiàng)的寫法結(jié)構(gòu)aaa:bbb,
data:{
text1:'hello world',
text2:'請(qǐng)關(guān)注我的頭條號(hào)',
},
//我認(rèn)為data是存放數(shù)據(jù)的地方
methods: {
// 這里是放函數(shù)事件的地方
myfun:function(){
return this.text2 + '我是落筆承冰！';
},
},
})
</script>
</body>
</html>
