vue与jquery相比，最大的变化就是大大减少了节点的操作，组件化更是好用到不行。往日都是用jquery做tab选项卡，今天有多余的时间，就顺便拿起了接触不多的vue来研究一下。
一说到选项卡，了解vue的人都会想到，用组件的切换来实现。
大概思路就是：
用 :is=“”来动态渲染组件
具体操作：
html
js
JS代码中，首先要把你需要切换的组件全部引入进来（这个方法我个人觉得可能有点浪费资源，但目前还没有找到更便捷的方法），这个currentView是一个变量，为了初始化页面的时候默认渲染一个组件，这里给初始值可以是你想要初始化页面就显示的组件名字。
function
在methods里面写点击事件，这里要解释的就是，当你点击li的时候传参aa，把li的下标（index）传进来，新建一个数组，把要切换的组件名添加进去，成为一个新数组，这里把currentView替换成数组对应下标的一个元素，这一步其实就是让currentView数组的下标和li的下标相对应。
到此为止已经可以实现tab最基本的切换功能，更多特效可以自行添加。
注：这里有可能会出现报错，具体原因我也不太清楚，但是加上keep-alive标签包裹一下组件就行了
网友评论