<div>
<model ref="mode_data" :child ="record"></model>
<a-table :columns="columns" :data-source="data">
<a slot="name" slot-scope="text">{{ text }}</a>
<span slot="customTitle">Name</span>
<span slot="action" slot-scope="text, record">
<a @click="showModal(record)">Delete</a>
</span>
</a-table>
</div>
</template>
<script>
const columns = [
{
dataIndex: "name",
key: "name",
slots: { title: "customTitle" },
scopedSlots: { customRender: "name" },
},
{
title: "Age",
dataIndex: "age",
key: "age",
},
{
title: "Address",
dataIndex: "address",
key: "address",
},
{
title: "Select1",
dataIndex: "select1",
key: "select1",
},
{
title: "Select2",
dataIndex: "select2",
key: "select2",
},
{
title: "Action",
key: "action",
scopedSlots: { customRender: "action" },
},
];
const data = [
{
key: "1",
name: "张三",
age: 32,
address: "New York No. 1 Lake Park",
select1: "0",
select2: "0",
},
{
key: "2",
name: "李四",
age: 42,
address: "London No. 1 Lake Park",
select1: "0",
select2: "1",
},
{
key: "3",
name: "王五",
age: 32,
address: "Sidney No. 1 Lake Park",
select1: "0",
select2: "0",
},
];
import Model from "./model.vue";
export default {
components: {
Model,
},
data() {
return {
data,
columns,
record: {},
};
},
beforeCreate() {
this.form = this.$form.createForm(this, { name: "normal_login" });
},
methods: {
showModal(record) {
this.$refs["mode_data"].child = record;
this.$refs["mode_data"].visible = true;
},
againData() {
let data1 = [
{
key: "1",
name: "张三11222",
age: 32,
address: "New York No. 1 Lake Park",
select1: "0",
select2: "0",
},
{
key: "2",
name: "李四222",
age: 42,
address: "London No. 1 Lake Park",
select1: "0",
select2: "1",
},
{
key: "3",
name: "王五22aaaaa2",
age: 32,
address: "Sidney No. 1 Lake Park",
select1: "0",
select2: "0",
},
];
this.data =data1;
},
},
};
</script>