Element -- ui: how to obtain the id or other attributes of the current object during tab switching, element -- uitab

Element -- ui: how to obtain the id or other attributes of the current object during tab switching, element -- uitab

1. Problem

When tab switching is used, you need to obtain the class name or id of the current element in some special scenarios.

2. solution: the tab switch is the binding function. The function passes the current object and obtains the object attributes through the current object.

Vue code: This project runs under vue-cli, so the vue initialization function is slightly different.

<Template> <el-tabs v-model = "activeName2" @ tab-click = "handleClick"> <el-tab-pane class = "chartsPanel" label = "Teaching Quality Distribution "name =" first-ta "> </el-tab-pane> <el-tab-pane class =" chartsPanel "label =" Scientific Research honor distribution "name =" second- ta "> </el-tab-pane> </el-tabs> </template>

<Script>
// Vue initialization function. export default {} is equivalent to new Vue ({}) export default {name: 'chart', data () {return {activeName2: 'First-ta ',}}, methods: {handleClick: function (tab, event ){
Console. log (event) console.log(event.tar get. getAttribute ('id') // obtain the id of the current element }}</script>