vue动态添加事件的问题

Question

项目是vue+element-ui的表格，是一个多级表头，项目中有很多多级表头就写了公用组件，遍历传过来的数据<el-table-column v-for="(data,index) in columnsTable"                         :label="data.tierData.titleName"                         :key="index"                         v-if="color"                         align="center">            <el-table-column v-for="(list,index) in data.tierData.content"                           :key="list.text"                           :label="list.text"                           :prop="list.dataIndex">              <template scope="scope">                {{scope.row[list.dataIndex]}}              </template>            </el-table-column>      </el-table-column>我的问题是，现在需求是有一个选择器可以控制隐藏一列表格，例如：选择地址，表格中这个多级的列都要隐藏，还请大家给个思路

Answer 1

看你给的代码是两级表头

data:{

    firstHeadHidden: '',

    secondHeadHidden: ''

}

<el-table-column v-for="(data,index) in columnsTable"

                         :label="data.tierData.titleName"

                         :key="index"

                         v-if="color || data.tierData.titleName !== firstHeadHidden"

                         align="center">

  <el-table-column v-for="(list,index) in data.tierData.content" 

                   :key="list.text" 

                   :label="list.text" 

                   :prop="list.dataIndex"

                   v-if="list.text !== secondHeadHidden">

    <template scope="scope">

      {{scope.row[list.dataIndex]}}

    </template>

  </el-table-column>

</el-table-column>

Answer 2

我想到就是控制你的content，你点地址就把地址的data从content中拿出来，这样你渲染的就不包含地址了，选择其他的再把其他的data拿出来，同时把地址的data放回去