首页 文章

如何在vue js中不使用v-for调用所选多项选项的id？

提问于
浏览 次
0

当我编辑帖子时，我很难通过使用vue js传递所选多个选项的值 . 我使用元素ui选择选项 .

PostController中

return Post::with('category')->with('tag')->find($id);

Post.vue

<el-select  v-model="form.tag_id" multiple placeholder="Select some">
    <el-option  v-for="tag in tags" :key="tag.id" :label="tag.name" 
    :value="tag.id">
   </el-option>
  </el-select>

<script>
data() {
return {
  tags: [],
  form: new Form({
    tag: [],
    tag_id: [],
  }),
}
// fetch all tags list
axios.get('/' + this.$route.params.trans + '/adminGetTags')
.then(({data}) => this.tags = data) 
//fetch post and tag which related to post
axios.get('/' + this.$route.params.trans + '/editPost/' + 
this.$route.params.id)
.then(({data}) => {
 //....
this.form.tag = data.tag
this.form.tag_id = data.tag
})

</script>

我需要像这样调用所选多项的id

this.form.tag_id = data.tag.id

Buit它会给出一个错误（无法读取未定义的属性'长度'）

但是如果我使用v-for它会工作，不幸的是我不能在select标签中使用v-model和v-for . 知道如何解决这个问题吗？

结果
The result of that code

development

html laravel vue.js

1 回答

  • 0

    我只是在脚本部分使用循环，它对我来说效果很好 .

    var j = 0;
       for(var i=1; i<= data.tag.length; i++)
       {

           this.form.tag_id[j] = data.tag[j].id
           j += 1 
       }
       return this.form.tag_id
    回复于

相关问题