Vue问题专用帖

1.Vue3+element Plus中拿el-tab的name和index值

<el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane
          v-for="item in DeviceGroupData"
          :label="item.deviceGroupName"
          :name="item.deviceGroupName"
        >
        </el-tab-pane>
</el-tabs>

// handleClick---顶部tab栏点击函数
    handleClick(tab) {
       //Vue2中直接tab.name和tab.index
      // Vue3中使用element plus需要使用tab.props.name！！！！
      // Vue3 中tab.index可以正常拿到
      if (tab.props.name) {
        this.deviceGroupCode = this.DeviceGroupData[tab.index].deviceGroupCode;
      }
    },

2.Vue2中使用this.$refs获取不到子组件

原因：子组件身上有v-if,当v-if为false的时候，这个时候在页面不存在，所有获取不到

解决方法：使用v-show代替v-if

其他可能：在使用this.$refs前，使用this. $nextick来包裹一下，保证页面渲染之后调用