vue选项卡切换

  <div id="app">
     <button @click='current="my-one"'>one</button>
     <button @click='current="my-two"'>two</button>
     <button @click='current="my-three"'>three</button>
     <!--动态组件-->
     <component :is="current"></component>
    
  </div>
  <script>
      new Vue({
        el:'#app',
        data:{
           current:'my-one'      这个是默认第一个选项卡出来
        },
         
        components:{
          'my-one':{
            template:`<div><h2>one</h2><p>oneone</p></div>`   //这个是选项卡的内容
          },
          'my-two':{
            template:`<div><h2>222</h2><p>222</p></div>`    //这个是选项卡的内容
          },
          'my-three':{
            template:`<div><h2>333</h2><p>333</p></div>`    //这个是选项卡的内容
          }
        }
      })