前言
记录一下,就是一个下拉框,外面的待选数据由数据库里来,并且选完保留后还能回显,次要记录的是回显操作,与我之前写的文章大同小异。
一、.vue
1.template
<a-form :form="Form" ><a-form-item>//留神上面的v-model,不是间接一个数组 <a-select v-model="Form.dataAuth" > <a-select-option v-for="item in list":value="item.key" :key="item.key"> {{ item.title }} </a-select-option> </a-select></a-form-item></a-form>
2.data
data () { return { list: [], Form: { dataAuth: [] } }}
3.created
created () { this.show()}
4.下拉框选项
methods: { show(){ //xxxxxxxxx是后端工程师给你的接口,也能够在JS里写,之后引进来应用 query(xxxxxxxxx).then(res => { const result = res.result.data result.forEach((res) => { this.list.push({ 'key':res.key, 'title':res.title }) }) }) },}
5.※回显※
methods: {show1() { query(xxxxxxxxx).then(res => { this.$set(this.Form, 'dataAuth', res.result.data) }) }}
这是后端工程师给你的,他将以这种样子返回给你数据
总结
像这样间接赋值,有时候不显示,最好还是.$set()
,不知起因
this.addForm.dataAuth = ress.result.data
像这样两层的,给dataAuth;[]
初值也不好使,如果把dataAuth;[]
单拿进去,赋初值就好使,不知起因
Form: { dataAuth: [] }
好了姐妹们,bye~~~