vue中component选项卡功能 按钮控制进入下一个页面

我在上一篇写了vue中component选项卡功能
今天又遇到还要通过 一个按钮 控制跳转下一个组件

结构我就不多介绍了 上一篇文章有

<div class="Nav-compent">
      <el-menu
        :default-active="nex"
        class="el-menu-demo"
        mode="horizontal"
        @select="handleSelect"
      >
        <el-menu-item
          v-for="(item, index) in navlist"
          :key="index"
          :index="index"
          ><span class="item">{{ item }}</span></el-menu-item
        >
      </el-menu>
      <component ref="cds" v-bind:is="resourceDetailView"></component>
    </div>

javascript

import aa from './aa';
import bb from './bb';
import cc from './cc';
import tourist from './tourist';
export default {
  data() {
    return {
      value1: 'c01',
      value2: '世界梦号',
      value3: 'WorldDream',
      value4: '311000165',
      value5: '9141077',
      value6: 'C6AV6',
      navlist: ['邮轮动态信息', '船舶证书文书信息', '船员信息', '旅客信息'],
      activeIndex: 0,
      resourceDetailView: 'aa',
      isActive: 0,
      nex: 0,
    };
  },
  components: {
    aa,
    bb,
    cc,
    tourist,
  },
  }

事件控制

handleSelect(e) {
     if (e) {
        this.nex = e;
        if (this.nex == '0') {
          this.checknav_(0, 'aa');
        } else if (this.nex == '1') {
          this.checknav_(1, 'bb');
        } else if (this.nex == '2') {
          this.checknav_(2, 'cc');
        } else if (this.nex == '3') {
          this.checknav_(3, 'tourist');
        }
      } else if(e==0){
        this.nex = e;
         this.checknav_(0, 'aa');
      }else {
        
        this.nex++;
        if (this.nex <= 2) {
          if (this.nex == '0') {
            this.checknav_(0, 'aa');
          } else if (this.nex == '1') {
            this.checknav_(1, 'bb');
          } else if (this.nex == '2') {
            this.checknav_(2, 'cc');
          }
        } else {
          this.checknav_(3, 'tourist');
        }
      }
    },
    checknav_(num, view) {
      if (num === this.isActive) return;
      this.isActive = num;
      this.resourceDetailView = view;
    },

按钮

<el-button
        v-if="isActive <= 2"
        type="primary"
        style="height: 40px"
        @click="handleSelect(e)"
        >下一步</el-button
      >

就这个了 ， 本人感觉写的复杂了 大神如果有简易方法 还望一起分享