vue设置标签名称,如何在Vue.js中设置optgroup选择标签？

I'm trying to make a select group in Vue.

I've tried this:

{{ sub.text }}

My data:

data: {

selected: 'A',

options: {

First: [

{ text: 'One', value: 'A' },

{ text: 'Two', value: 'B' }

],

Second: [

{ text: 'Three', value: 'C' }

]

}

}

解决方案

You are binding the label attribute to option, which is an array. What you want is to bind to the object's key.

You can get the key of each option by specifying a second parameter in the v-for directive:

I'd also rename your options property to optionGroups to avoid further confusion:

data: {

selected: 'A',

optionGroups: {

First: [

{ text: 'One', value: 'A' },

{ text: 'Two', value: 'B' }

],

Second: [

{ text: 'Three', value: 'C' }

]

}

}

That way, the template will make more sense:

{{ option.text }}