ElementUI中Table和Switch组件中插槽scope应用使用场景

ElementUI中Table和Switch组件中插槽scope应用使用场景

ElementUI 安装

npm i element-ui -S

引入 Element

main.js 内容添加

import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';

Vue.use(ElementUI);

按需引入和注册

别忘了table和Switch组件的按需引入和注册--在element.js中引入

import {  Table, TableColumn, Switch  } from "element-ui";

Vue.use(Table)
Vue.use(TableColumn)
Vue.use(Switch)

 

 

使用插槽slot-scope方式拿到表格数据。直接给开关的v-model属性绑定。开关Siwtch的v-model是布尔值，scope.row.mg_state是拿到后台数据中的状态值：true或false