这个是要写的组件的代码,跟不是组件的代码
<p id="parent">
<child :message="animal"></child>
</p>
<select name="sth" id="sth">
<option :value="value">{{text}}</option>
</select>
下边的是JS
Vue.component('child',{
template:'<select :name="message+\'Select\'">\
<optgroup :label="message">\
<option :value="message">{{message}}</option>\
</optgroup>\
</select>',
props:['message']
});
new Vue({
el:"#parent",
data:{
animal:'phoenix'
}
});
new Vue({
el:"#sth",
data:{
value:'animal',
text:'animation'
}
});
最后渲染出来的是
<p id="parent">
<select name="phoenixSelect">
<optgroup label="phoenix">
<option>phoenix</option>
</optgroup>
</select>
</p>
<select name="sth" id="sth">
<option value="animal">animation</option>
</select>
下边那个非组件的,value就能正常显示成动态值animal,而上边那个是组件的,name跟label都正常,就是value显示不出来,请问是为什么啊?