v-select不识别标签属性

Question

我正在编写一个VueJs文件，并尝试使用<v-select>，所以我要做的是：

<v-select :options="divisions" label="text" ></v-select>

我的分区是一个包含id和text的对象数组，但是当我转到我的页面时，我的每个分区的值都是<% getOptionLabel(option) %>而不是text值

以下是console.log(this.divisions)的屏幕截图：

​

所以这是我的代码：

 <form id="MassUpdateDivisionForm">
       <v-select v-bind:label="text" :options="divisions"></v-select>
 </form>
<script>

 import vSelect from "js/vue-select/vue-select.js"
 export default {
    props: ['product'],
    components: {vSelect},
    data() {
        return {
            divisions: []
        }
    }
    methods: {
         getDivisions(){
             let self = this
            this.$http({
                url: 'divisions',
                method: 'get'
            }).then((response)=>{
                self.$set('divisions', response.data)
                console.log(self.divisions)
                //that's where I got the pic
                },(response)=>{
                alert('something went wrong')
                }
            )
        }
    },
    created () {
        this.getDivisions()
    },
}
</script>

Answer 1

如果我理解正确的话，您希望所选选项的文本属性显示为标签？如果是这样，您将需要将所选选项的数据传递回<v-select>。您可以在更改时发出事件以将label更改为文本值，但请确保使用v-bind:label=text或速记:label=text绑定到label属性

Answer 2

我只是遇到了同样的问题，并通过将标签的名称作为字符串传递来解决它。

<v-select :options="warehouses" :label="'name'"></v-select>

或者您可以使用不带vue绑定的html属性来完成此操作。

<v-select :options="warehouses" label="name"></v-select>

干杯,