后端返回给我categoryId是17 我要从category:[{name:'张三',categoryId:17},{name:'张三',categoryId:18},{name:'张三',categoryId:19},{name:'张三',categoryId:20}]找到id是17的数据 把他的name渲染到 <el-form-item label="商品类目" prop="categoryId"> <el-select @focus="open" v-model="form.categoryId" filterable clearable placeholder="请选择商品类目" > <el-option v-for="item in category" :key="item.categoryId" :label="item.name" :value="item.categoryId" > </el-option> </el-select> </el-form-item>中的select 并且v-model绑定这个id 怎么做 同时我 data() { return { // 表单信息 form: { title: "", smallTitle: "", categoryId: "", manImage: [], dataUrl: [], skuList: [ { name: "", size: "", price: "", stock: "", attributeurl: "" }, ], },}
时间: 2023-07-19 20:03:07 浏览: 82
你可以使用 Array.prototype.find() 方法来查找对应的数据,并将其渲染到表单中。同时,你需要将 `form.categoryId` 的值设为对应的 `categoryId`,以便表单能够正确提交。下面是示例代码:
```
data() {
return {
// 表单信息
form: {
title: "",
smallTitle: "",
categoryId: "",
manImage: [],
dataUrl: [],
skuList: [
{ name: "", size: "", price: "", stock: "", attributeurl: "" },
],
},
category: [
{ name: '张三', categoryId: 17 },
{ name: '张三', categoryId: 18 },
{ name: '张三', categoryId: 19 },
{ name: '张三', categoryId: 20 },
],
};
},
methods: {
open() {
// 查找对应的数据
const category = this.category.find(item => item.categoryId === 17);
// 渲染到表单中
this.form.categoryId = category.categoryId;
this.form.categoryName = category.name;
}
}
```
在上面的代码中,`open()` 方法是在表单的 select 控件获得焦点时触发的。你可以根据实际需求来触发该方法。另外,你需要将 `categoryName` 添加到表单信息中,并在模板中使用它来渲染 select 控件的 label。
阅读全文