elementUI选择框选择后,绑定的值存在但是没有显示label的问题

问题:

今天写elementUI时,发现之前下拉选择框正常在刚刚选择了一个项后,label无法正常显示,但是select绑定的值却可以正确变化
代码段:

<el-select v-model="model.flowerId">
     <el-option 
			v-for="flower in flowerInfo" 
			:key="flower.id"
			:label="flower.name" 
			:value="flower.id"
	></el-option>
</el-select>

选择后选择框还是显示请选择

解决办法:

<el-select v-model="model.flowerId" @change="change">
     <el-option 
			v-for="flower in flowerInfo" 
			:key="flower.id"
			:label="flower.name" 
			:value="flower.id"
	></el-option>
</el-select>

在select中 加入 @change=‘change’

change(){
	this.$forceUpdate();
	//完美解决
}

出现问题原因:

出现这个问题好像是因为下拉框数据是循环掉别的接口得来的，因为数据层次太多，render函数没有自动更新，需手动强制刷新所以我直接强制刷新了值，而forceUpdate就是重新render。
写一个方法，在select的change事件中调用此方法，运用 this.$forceUpdate()强制刷新，页面正常选值。

forceUpdate()方法

forceUpdate()这个方法也适用一些很深的组件 state 已经改变了的时候，可以在该组件上面调用，解决页面v-for中修改item属性值后页面页面值不改变的问题。