关于javascript:Vue-简单实现tab切换效果

需要是这样的，须要做一个点击小标题，切换出绝对应的卡片内容，因为性能很简略不想用插件，所以就手敲了一个，心愿能帮忙到你。

   <div id="app">
      <ul class="tilte">
        <li @click="cur=0" class="column">题目一</li>
        <li @click="cur=1" class="column">题目二</li>
        <li @click="cur=2" class="column">题目三</li>
      </ul>
      <div class="content">
        <div v-show="cur==0">内容一</div>
        <div v-show="cur==1">内容二</div>
        <div v-show="cur==2">内容三</div>
      </div>
    </div>
   
    <script>
    export default {
        data () {
           return {
             cur: 0,// 默认选中第一个值
         }
    }
     
    </script>

如果须要加动静的款式，能够在class下面加一个动静的款式，代码如下：

  <ul class="tilte">
        <li @click="cur=0" :class="{column:cur==0}">题目一</li>
        <li @click="cur=1" :class="{column:cur==1}">题目二</li>
        <li @click="cur=2" :class="{column:cur==2}">题目三</li>
  </ul>

款式的话本人增加吧。