1. 問題 當使用tab切換時,部分特殊場景需要獲取當前元素的類名或者id。 2.解決思路,tab切換是綁定函數,函數會傳遞過去當前對象,通過當前對象獲取對象屬性 vue部分代碼:本項目是在vue-cli下運行,因此vue的初始化函數略有差異。 ...
1. 問題
當使用tab切換時,部分特殊場景需要獲取當前元素的類名或者id。
2.解決思路,tab切換是綁定函數,函數會傳遞過去當前對象,通過當前對象獲取對象屬性
vue部分代碼:本項目是在vue-cli下運行,因此vue的初始化函數略有差異。
<template> <el-tabs v-model="activeName2" @tab-click="handleClick"> <el-tab-pane class="chartsPanel" label="教學質量分佈" name="first-ta"></el-tab-pane> <el-tab-pane class="chartsPanel" label="科研榮譽分佈" name="second-ta"></el-tab-pane> </el-tabs> </template>
<script>
//vue初始化函數, export default{} 相當於 new Vue({}) export default { name: 'chart', data () { return { activeName2: 'first-ta', } }, methods: { handleClick: function (tab, event) {
console.log(event) console.log(event.target.getAttribute('id')) //獲取到當前元素的id } } } </script>