render函數簡單的用法 ~~~ template, 這里的item是遍歷v-for = "item in items"的值， 傳了兩個參數item.name和item.id <Button type="primary" @click.stop="editBtn(item)">編輯</Button> js代碼,這里render一個輸入框 edit (e) { this.$Modal.confirm({ title: '編輯', closable: true, render: (h) => { return h('Input', { props: { value: e.name, placeholder: '請輸入要修改名稱' }, on: { input: (val) => { // this.value = val; console.log(this.value) } }, nativeOn: { change: (e) => { console.log(e.target) } }, }) }, onOk: () => { console.log(this.value) } }) } ~~~ #### **這里有個問題就是當我們使用v-for列表渲染的時候，當我們改變其中一個input的值的時候，其他input框不改的，它就會繼承上一個input的值** #### 下面render一個輸入框和select框 ~~~ // template 里的代碼 <Button type="primary" @click.stop="editBtn(item)">編輯</Button> // js的代碼 edit (e) { this.$Modal.confirm({ title: '編輯', closable: true, render: (h,params) => { return h('div',[ h('Input', { props: { value: e.name, autofocus: true, placeholder: '請輸入要修改的試卷名' }, attrs:{ id: e.id }, style: { marginBottom: '10px' }, on: { input: (val) => { this.value = val } } }), h('Select', { props: { // value: e.examTime * 60 + "分鐘", label: e.examTime * 60 + "分鐘", placeholder: e.examTime * 60 + "分鐘" }, on: { 'on-change': (val) => { this.selectValue = val; } } }, [ h('Option', { props: { value: '0.5' } }, '30分鐘'), h('Option', { props: { value: '0.75' } }, '45分鐘'), h('Option', { props: { value: '1' } }, '60分鐘'), h('Option', { props: { value: '1.25' } }, '75分鐘'), h('Option', { props: { value: '1.5' } }, '90分鐘'), h('Option', { props: { value: '1.75' } }, '105分鐘'), h('Option', { props: { value: '2' } }, '120分鐘') ]) ]) }, onOk: () => { console.log(this.value) console.log(this.selectValue) } }) } ~~~ #### 這里的問題同上，就是改變其中一個值的時候，其他的值如果沒有發生改變，那么就默認繼承上一個值