#vue到底是什麼呢？
它是以mvvm的框架和angular類似，較小且容易上手。
vue官網：
vue手冊網址：
如果你會angularular 所以非常好好學習vue了。因為說了他們基本上類似
vue指令以v-xxx vue由一片html代碼配合上json，new出來一個vue實例 vue是個人開發由個人來維護
## 由於小巧所以他比較適用於移動端，同樣他和angular一樣不相容IE低版本 使用的話一樣你得先去vue官網下載他的庫文件。 vue基本用法：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="box"> //上面说了我们需要一片html代码来展示数据
{{msg}} //这样我们就完成了一条数据的基本展示
</div>
<script src="vue.js?1.1.11"></script>
<script>
new Vue({ //new 一个实例来展示一条基本数据
el:"#box", //el意思是element这个是固定的后边的是页面中你要展示数据到那个元素，就类似于anguar的控制器。 只是angular是写在html
页面中这个是获取到了元素然后再展示。它里面是选择器class id 标签名都是可以的。
data:{ //data也是定死的
msg:"这是一条数据" //这其中就是数据当然他是个对象你可以写多条数据,还有这里面只可以放数据不可以是函数
}
})
</script>
</body>
</html><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="box"> //上面说了我们需要一片html代码来展示数据
<button v-on:click="fn()"></button> //v-on: 后面可以跟你任何想跟的事件。
{{msg}} //这样我们就完成了一条数据的基本展示
</div>
<script src="vue.js?1.1.11"></script>
<script>
new Vue({
el:"#box",
data:{
msg:"这是一条数据" //这里只可以是数据
}，
methods:{ //这里写方法
fn:function(){ //如果你要使用上边的数据也不太一样angular是 $scope.a
alert(1);
alert(this.msg); //这个this代表new的实例对象所以 this.msg 就调用到上边的数据了
}
}
})
</script>
</body>
</html>##
##
//前边说了需要一片html代码来实现这就是我们那一片代码
以上是vue基本使用的詳細內容。更多資訊請關注PHP中文網其他相關文章！
