elementui之el-table如何通过v-if控制按钮显示与隐藏
作者:在奋斗的大道
这篇文章主要介绍了elementui之el-table如何通过v-if控制按钮显示与隐藏问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
el-table通过v-if控制按钮显示与隐藏
前端效果演示
后端代码
<el-row> <el-table :data="tableData" style="width: 100%;" row-key="id" :tree-props="{children: 'children', hasChildren: 'hasChildren'}"> <el-table-column prop="privilegeName" label="权限名称" > </el-table-column> <el-table-column prop="privilegeCode" label="权限编码" > </el-table-column> <el-table-column prop="privilegeType" label="权限类别" :formatter="formatPrivilegeType" > </el-table-column> <el-table-column label="操作"> <template slot-scope="scope"> <el-button v-if="scope.row.privilegeType === '1' || scope.row.privilegeType === '2'" type="primary" size="mini" @click="toAdd(scope)">新增</el-button> <el-button type="primary" size="mini" @click="toEdit(scope)">编辑</el-button> </template> </el-table-column> </el-table> <br> <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pagination.pageIndex" :page-sizes="[5, 10, 20, 30, 40]" :page-size=pagination.pageSize layout="total, prev, pager, next" :total=pagination.total> </el-pagination> </el-row>
总结
以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。