也不知道从什么时候就开始学习Vue了，学了许久感觉还是没有入门，这里就把自己学习到的内容做一个整理，留给以后的自己或者其他人看看。
初视Vue
最开始学习的时候，是在B站上，跟着狂神学习的，怎么说狂神Vue教学时候后端开发者，属于能够看懂，能够少部分写前端的代码，都知道在后端的眼里自己是大后端，懂了吧，同志们。
但是我还是建议后端初学者，应该看一下狂神的Vue教程。给自己以后前端打个基础。
首先，我们不是直接上来就是用vue-cli脚手架创建项目，首先学的是，就是在我们熟知的html中嵌入Vue，简单来说就是导入Vue的包，就像这样：
<script src="https://cdn.bootcss.com/vue/2.5.2/vue.min.js"></script>
就像我们最开始导入js的文件一样，导入进来之后我们就可以使用Vue了。
这里我们有一个div，他的id值为app，可以看到下面有一个脚本，里面定义了一个变量vm，他是vue的对象，然后使用el来绑定这个app所指的的标签（下面的代码需要放在body里面）。
<div id="app">
</div>
<script src="https://cdn.bootcss.com/vue/2.5.2/vue.min.js"></script>
<script>
var vm = new Vue({
el:"#app"
});
</script>
可以看看下面这段代码，相比于上面的代码，在vm对象里面，多了一个data的属性（可以这样看），他是json格式，里面有一个属性叫做message，然后在div里面使用 {
{}}来调用，如果你运行了代码，你就会看见界面里面的hello vue，{
{}}就是Vue取值的方式。
<div id="app">
{
{
message}}
</div>
<script src="https://cdn.bootcss.com/vue/2.5.2/vue.min.js"></script>
<script>
var vm = new Vue({
el:"#app",
data: {
message: "hello vue"
}
});
</script>
7大属性
谈到Vue，就不得我说Vue的7大属性，其中包括el，data， computed，methods，template，watch，render
- el：用来指示vue指示器从哪里开始，可以说是一个占位符
- data： 数据的存放地方，可以将视图的数据抽象出来放在data里面
- computed：用来计算属性的（这个有点忘了）
- methods：就是方法，函数
- template：用来设置模板
- watch：监听，相应数据的变化
- render：创建虚拟dom
7大指令
你们都知道无论在什么语言中，都会有if，for等逻辑判断词，vue也有，只不过是类似于v-if，v-for，这些也是vue重要的东西，俗称vue的7大指令，有v-if，v-else，v-for，v-show，v-bind，v-on，v-model
- v-if：判断后面的bool值，判断是否做出渲染，
<div id="app">
<p v-if="isTrue"> 你能看见这句就表示if的值为true</p>
</div>
<script src="https://cdn.bootcss.com/vue/2.5.2/vue.min.js"></script>
<script>
var vm = new Vue({
el: "#app",
data: {
isTrue: true
}
});
</script>
- v-else：就和java中的else一样，不多说，可以尝试尝试
- v-for：这个就是for循环，拿到data中的数据，使用
type in types，type就是每一条数据
<div id="app">
<li v-for="type in types">
{
{
type.message}}
</li>
</div>
<script src="https://cdn.bootcss.com/vue/2.5.2/vue.min.js"></script>
<script>
var vm = new Vue({
el: "#app",
data: {
types: [
{
message: "我看众生皆草木,"},
{
message: "唯独视你如青山."}
]
}
});
</script>
- v-bind：这个就是绑定某个class或元素的style样式，要和v-model区别开来
- v-model：进行数据的双向绑定。
8大方法
…