iview Table元件使用render新增Select下拉框並進行雙向繫結

問題描述:Table元件使用render 渲染 select下拉框

---

1, 效果圖

2, 程式碼

columns: [{
    type: 'selection',
    width: 60,
    align: 'center'
},
{
    title: '產品分類',
    key: 'categoryId',
    render: (h, params) => {
        return h('Select', {
          props: {
            value: params.row.categoryId, // 獲取選擇的下拉框的值
            size: 'small'
          },
          on: {
            'on-change': e => {
              params.row.categoryId = e // 改變下拉框賦值
            }
          }
        }, this.productTypeList.map((item) => { // this.productTypeList下拉框裡的data
          return h('Option', { // 下拉框的值
            props: {
              value: item.id,
              label: item.name
            }
          })
        }))
    }
}]

複製程式碼

• 如有問題,歡迎指正

• 本文為原創,如需轉載,請註明出處: iview ,render新增Select下拉框