zoukankan      html  css  js  c++  java
  • parent

      <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>
  • 相关阅读:
    设计模式3.1 Abstract Factory(抽象工厂)对象创建型模式
    设计模式文本编辑器
    Jquery调用webService远程访问出错的解决方法
    重构列表
    设计模式3.创建型模式
    设计模式 3.2 Builder(生成器)对象创建型模式
    设计模式 3.4 Prototype(原型)对象创建模式
    设计模式3.3 Factory Method(工厂方法) 对象创建型模式
    C# Word.Office操作总结
    设计模式 3.5 Singleton(单件)对象创建型模式
  • 原文地址:https://www.cnblogs.com/bluekang/p/15796030.html
Copyright © 2011-2022 走看看