声 明本教程是作者（孤狼）在学习Vue.js过程中总结笔记而来。编写过程中使用的Vue版本为Vue.js2.6.14。本教程可以随意转载，但请保留出处。
好了，好久没有更新过一起学系列教程了，这次一起来学习的课程是Vue.js V2版本。估计很多人很纳闷，不是已经发布V3版本了，为啥要学习V2的版本。虽然Vue3已经发布了一段时间，但是还有很多项目停留在V2版本，而且学习了V2之后有利于理解V3版本。后续学习V3会很容易。所以，开始吧。
Vue.js官网 https://cn.vuejs.org
TIP：在学习Vue.js的过程中，默认你会html+css+js整套代码，如果不会，可能无法看懂部分代码。
目前所有的前端都自称为大前端时代。所以项目不用vue感觉低人一等。好吧，其实是随着时代的进步，前端不再是以前的简简单单的调调js，做个点击动画那么简单了，前端目前的发展是独立出来发展。后台提供接口，前端直接来处理数据并展示。这样有利于项目的模块化。web前端独立处理，app前端独立处理，小程序前端独立处理，后台只需要提供接口即可。以往后台攻城狮要把前端页面直接输出的方式慢慢的会消失。
而且随着小程序越来越多，越来越火，这种前后分离的开发将会是常态。
不是任何时候都要用到vue.js的。
如果页面很简单，可以用十几行代码完成的，不要用vue.js
如果页面没有什么特别复杂的交互逻辑，业务逻辑很简单，也不要用vue.js
使用vue.js对于很小的项目来说作用是负面的，他会让你的页面变得庞大。
如果你的页面逻辑很多，交互很多，各种数据穿插，各种后台判断请求，这时候就可以用Vue.js
做小程序开发。虽然微信小程序修改了很多vue的代码，但是依然是vue.js，这个时候还是用vue.js
方法一：独立使用
vue.js可以独立加载使用，即单页面使用。如果你项目只是其中一部分使用vue.js，那么就可以采用这个方式。
在官网下载vue.js文件，本地应用一下即可。也可以通过cdn来引用，不过还是建议本地引用比较安全。
孤狼 | 
2022-07-28 23:25:56 | 
1007°C | 
0条评论 ]<script src="../vue.js"></script><script src="https://cdn.jsdelivr.net/npm/vue@2.7.8"></script>方法二：使用脚手架
如果你是一个新项目，确定要使用vue.js来构建整个项目。那么就可以使用Vue CLI（脚手架）来生成一个全新的Vue项目。
这里可以查看后面Vue CLI章节。
万年的初始化HelloWorld环节。
1.下载好一个vue.js本地文件
2.新建一个 index.html 文件，并编写以下代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Vue helloworld</title>
<script src="./vue.js"></script>
</head>
<body>
<div id="msg">{{text}}</div>
<script>
const v=new Vue({
el:"#msg",
data:{
text:"123",
}
});
</script>
</body>
</html>保存后用浏览器运行一下，就可以看到
创建一个Vue实例：
Vue应用都是通过Vue函数创建一个新的Vue实例开始的
let vm=new Vue({});数据与方法：
当一个 Vue 实例被创建时，它向 Vue 的响应式系统中加入了其 data 对象中能找到的所有的属性。当这些属性的值发生改变时，视图将会更新为新的值。
let data{name:'张三'}
let vm=new Vue({
el:xxx,
data:data
})参数意义：
el:
类型:string | HTMLElement
作用:指定响应代码的元素
data:
类型:Object | Function
作用:指定响应的数据对象
methods:
类型:{[key:string]:Function}
作用:定义方法函数
{{text}}
作用:对应绑定的data里的数据
赞赏一个鸡腿
