iView table 單選實現（轉載）

 

來源：https://blog.csdn.net/qq_35858002/article/details/88710244

效果

 

 代碼

 <Table ref="modalTable":columns="modalColumns" :data="deliveryData" border stripe></Table>
data() {
      return {
 currentChoose: '',
modalColumns: [
          {
            title: '選擇',
            key: 'id',
            width: 70,
            align: 'center',
            render: (h, params) => {
              let id = params.row.id;
              let flag = false;
              if (this.currentChoose === id) {
                flag = true
              }
              let self = this
              return h('div', [
                h('Radio', {
                  props: {
                    value: flag
                  },
                  on: {
                    'on-change': () => {
                      self.currentChoose = id;
                    }
                  }
                })
              ])
            }
          },
          {title: '姓名', key: 'name'},
          {title: '手機號', key: 'contactPhone'},
 
        ],
 
}}
 

　　

 

 

iView table單選實現

carry_carrie 2019-03-21 11:20:49  4869  收藏 3

分類專欄： iView 文章標籤： table iView

版權

 <Table ref="modalTable":columns="modalColumns" :data="deliveryData" border stripe></Table>

1.  
   data() {
2.  
   return {
3.  
   currentChoose: '',
4.  
   modalColumns: [
5.  
   {
6.  
   title: '選擇',
7.  
   key: 'id',
8.  
   width: 70,
9.  
   align: 'center',
10.  
    render: (h, params) => {
11.  
    let id = params.row.id;
12.  
    let flag = false;
13.  
    if (this.currentChoose === id) {
14.  
    flag = true
15.  
    } else {
16.  
    flag = false
17.  
    }
18.  
    let self = this
19.  
    return h('div', [
20.  
    h('Radio', {
21.  
    props: {
22.  
    value: flag
23.  
    },
24.  
    on: {
25.  
    'on-change': () => {
26.  
    self.currentChoose = id;
27.  
    }
28.  
    }
29.  
    })
30.  
    ])
31.  
    }
32.  
    },
33.  
    {title: '姓名', key: 'name'},
34.  
    {title: '手機號', key: 'contactPhone'},
35.  
     
36.  
    ],
37.  
     
38.  
    }}