切换状态时使用的这种开关样式的组件 , 比较显眼和方便
先把html组件结构加上, 尽量把值改成true false的形式 , 其他值容易出问题 , 在table中使用如下所示
<el-table-column prop="id" label="操作"> <template slot-scope="scope"> <el-switch v-model="scope.row.status" :active-value=true :inactive-value=false active-color="#13ce66" inactive-color="#ff4949" @change="switchStatus(scope.row.status,scope.row.id)" > </el-switch> <el-button @click="deleteAccount(scope.row.id)" type="text" size="small">删除</el-button> </template> </el-table-column>
方法部分这样写
//切换状态 switchStatus:function(status,id){ var data={ status:status==true?1:0, id:id, } $.post("index.php?r=media/switchtoutiaoaccoutstatus",data); },