如何在tabs标签页判断属于哪个标签页的值并传递给父组件

(标签页的数据二选一)在tabs标签页下的两个标签,我通过自定义函数来获取标签页下组件的内容;我需要把在哪个标签页下对应的内容传给父组件;但是遇到的问题就是我监听activeName的变化判断当前是哪个标签页,但是标签页是监听到了,但是她下面的内容我必须通过切换了才能获取到数据(我标签页的组件也是改变一个就传上来的数据,但是默认的时候监听不知道在监听activeName的时候那个获取到组件的内容如何同步监听到然后传到父组件去),所以我在默认停在当前标签页的时候,传递过去的数据是空的,我必须切换一下标签页数据才能准确的传递到父组件上去;

其实我想要的效果是获取这个标签页对应的数据然后传递给父组件,但是没想到其他方法;就用的这个方法;各位朋友能有什么简便的方法吗?或者是我这个方法可行然后帮帮我解决这个问题

讲的是有点混乱,各位朋友哪没明白就直接问,我秒回;

表格的标签页
<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
        <el-tab-pane label="装备数据" name="first">
          "$attrs" v-on="$listeners" @firstBind="firstBind" />
        el-tab-pane>
        <el-tab-pane label="手动填写" name="second">
          "$attrs"
            v-on="$listeners"
            @secondBind="secondBind"
          />
        el-tab-pane>
      el-tabs>

进行的操作判断传值
export default {
  components: {
    equList,
    equListManual,
  },
  props: {},
  watch: {},
  data() {
    return {
      workplanId: "",
      activeName: "first",
    };
  },
  watch: {
    //监听判断内容属于哪个标签页进行传值
    activeName: {
      handler(val) {
        console.log(
          "tab标签的切换值",
          val,
          this.taskJournalProcessfirst,
          this.taskJournalProcesssecond
        );
        if (val == "first") {
          this.$emit("todo", this.taskJournalProcessfirst);
        } else {
          this.$emit("todo", this.taskJournalProcesssecond);
        }
      },
      immediate: true,
    },
  },
  created() {},
  methods: {
    //切换改变activeName的值
    handleClick(val) {
      this.activeName = val.name;
    },
    //第一个标签页的值
    firstBind(val) {
      this.taskJournalProcessfirst = val;
    },
    //获取第二个标签页的值
    secondBind(val) {
      this.taskJournalProcesssecond = val;
    },
  },
};

 
 //第一个标签页的值
    firstBind(val) {
      this.taskJournalProcessfirst = val;
      if(this.activeName == "first"){
       this.$emit("todo", this.taskJournalProcessfirst)
      }
  },
//获取第二个标签页的值
    secondBind(val) {
        this.taskJournalProcesssecond = val;
        if(this.activeName == "second"){
        this.$emit("todo", this.taskJournalProcesssecond);
        }
   },


是不是把tabPanel下的组件改成如此,使用.sync绑定变量,然后页面定义个taskJournalProcessfirst变量

<equList v-bind="$attrs" v-on="$listeners" :data.sync="taskJournalProcessfirst" />

然后子组件内部taskJournalProcessfirst数据有更新的时候就this.$emit('update:data', 新数据)
这样在这个总的页面始终都能拿到最新的数据,然后直接判断当前要哪个就行,同理另一个equListManual组件也是这样处理。因为我看你原先的方案核心在切换的时候再去解决数据的问题,其实可以从一开始就维护好,始终确保在当前页面是最新的值,你就可以配置watch activeName直接操作了