antd table组件单元格嵌入select选择器

antd table组件单元格嵌入select选择器

dom
   <a-table
      :columns='columns'
      :dataSource='columnsList'
      rowKey="key"
      :pagination="false"
      :row-selection="selection"
    >
    <template slot="select" slot-scope="text">
      <div key="select">
        <a-select :showArrow="true" :value='text' placeholder="请选择" :filterOption="false"  @change='changeFun' :dropdownMatchSelectWidth="false">
          <a-icon slot="suffixIcon" type="right"></a-icon>
         <a-select-option v-for="val in selectList" :key="val">
            val
         </a-select-option>
        </a-select>
      </div>

    </template>
    </a-table>
    
     data() {
    return {
      openKeys:['first'],
      collapsed: false,
      list: [],
     clickArr:[],
     columnsList:[
       {
         title:"姓名",
         dataIndex:"name",
         key:"name",
       },
        {
         title:"手机号",
         dataIndex:"tel",
         key:"tel",
         scopedSlots:{customRender:"select"}
       },
     ],
     columns:{},
     selection:{},
     selectList:[]

    };
  },
      created() {
      this.list=[
        {
          "key":"1",
          "title":"AAA",
          "src":"A.png",
          "children":[
            {
              "key":"10",
              "title":"children",
              "src":"A.png",
              "url":"sasdadsd.html"
            },
            {
              "key":"11",
              "title":"children2",
              "src":"b.png",
              "url":"2222sasdadsd.html"
            }
          ]
        }
      ]
      this.getForm()
      this.selectInit()
  },
   selectInit(){
    this.selection={
      columnsWidth:"10px",
      onChange:(selectedRowKeys,selectRows)=>{

      },
      onSelect:(record,selected,selectRows)=>{
        this.selectList=selectRows
      },
      onSelectAll:(selected,selectRows,changeRows)=>{
        this.selectList=selectRows
      }
    }
  
  },
    changeFun(){
      this.selectList[0].select=value
    }
  },