想要使冻结这个按钮根据状态的改变而改变,话不多说直接上代码
<el-table v-loading="loading" :data="diaryInfoList" @selection-change="handleSelectionChange" border >
<el-table-column label="状态" align="center" prop="deleted" >
<template slot-scope="scope">
<el-switch
v-model="scope.row.deleted"
:active-value="0"
:inactive-value="1"
disabled
active-color="#13ce66"
inactive-color="#ff4949"
@change="changeDeleteSwitch(scope.row.deleted)"
/>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" >
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['user:user:remove']"
> {{ scope.row.deleted == 0 ? '冻结' : '解除冻结' }} </el-button>
</template>
</el-table-column>
</el-table>
在el-button中使用 {{ scope.row.deleted == 条件 ? '值1' : '值2' }},效果如下