Vue2要掌握的几大关键知识点

一：组件

一般来说，一个Vue文件就是一个页面，但一个页面可以不仅仅只有一个vue文件，在定义Vue的代码中，如：

export default {
  computed:{
  }
}

computed中便可放入子组件，再用标签的形式就可以将这个组件放入这个主Vue的界面中，这样可以提高复用性。

二：VueX

这是一个放数据的“仓库”，创建一个store文件，在其中进行配置，最后在main.js中用Vue.use的形式调用，那么恭喜你，你可以在任何Vue文件中调用里面的数据、方法，里面有三个放数据的地方，放方法的是actions和mutations，不同的是，前一个注重于逻辑判断，并将返回的结果传入mutations中，最后在mutations中完成一切，放数据的是state，可以将需要在不同vue文件中复用的数据存在这里面。

 当然如果还想再具体的话，可以在store文件里面继续创建子仓库，如图，我便创建了两个子仓库，再用如图方式使用modules来在主仓库中注册。

关于如何在vue文件中调用仓库中的东西的问题，第一个方法是使用

this.$store.state

这是调用数据

this.$store.dispatch('jia'，value)

将这段代码写在自己定义的方法里面，这是将自己定义的方法和actions中的方法绑定

this.$store.commit('JIA',value)

将这段代码写在自己定义的方法里面，这是将自己定义的方法和mutations中的方法绑定

第二个便是用mapmutations调用

三：VueRouter

这是vue中的路由方法，可以实现vue文件之间的跳转，

<router-link class="nn" to="/myhome/myindex">首页</router-link>
      <router-link class="nn" to="/myhome/myname">购物精选</router-link>
      <router-link class="nn" to="/myhome/mycount">社区精选</router-link>
      <router-link class="nn" to="/myhome/mymusic">商家入驻</router-link>

如这段代码，是实现跳转的按钮

 <router-view class="view"></router-view>

然后写下这段标签，就可以将呈现的Vue文件通过这个标签呈现

四：Vue指令

各种如v-on,v-bind等，要求掌握