极客观点
项目管理
HarmonyOS
select下拉框中的option是后台发送过来的，我在主页请求接口拿到数据，存到vuex中，在子页监听获取到，赋值是成功了，但是{{option}}这种插值会进行数据更新，下拉框中的option中数据却仍然是空的，我通过使用vue.$set()进行处理，但是仍然没有变化，不知道时哪里的问题， 难道是表单的响应机制和其它的有区别吗，有了解的烦劳解答下，再次先谢谢了！
name:"baseSubInformationForm",
components: {
baseInforForm:baseInfor,
inforForm:informationForm
},
data() {
return {
informationTitle:"基本信息",
networkStateOptions:[], //options选项
searchData:networkBaseData,
searchForm:networkBaseForm,
name:"",
commonQuery:[]
};
},
created() {
this.networkCommonData();
},
mounted() {
console.log(this.formData);
console.log(6666);
this.arrChange();
// this.networkStateOptions = this.netState.chainNetworkState;
},
computed: {
//获取vuex中的数据netState（数据由其他页面请求而来）
...mapState({
netState:state=>state.formData.commonComboData,
formData:state=>state.formData.netBaseFormData
})
},
watch: {
netState:function(oldVal,newVal) {//监听netState
console.log("简简单单");
this.networkStateOptions=this.netState.chainNetworkState;监听到数据后赋值给networkStateOptions
// this.$set(this.networkStateOptions,[...this.netState.chainNetworkState]);
// this.networkStateOptions=this.networkStateOptions.concat(this.netState.chainNetworkState)
// this.networkStateOptions=Object.assign()
console.log(123);
console.log(this.networkStateOptions);
},
formData:function(oldVal,newVal) {
console.log(123456);
console.log(this.formData);
this.searchData=this.formData;
}
},
methods: {
changeSave() {
console.log(666);
},
arrChange() {//给表单添加options属性，并赋值监听到的数据
// this.networkStateOptions = this.netState.chainNetworkState;
this.searchForm=networkBaseForm.map(item\=> {
switch(item.label) {
case"网点状态":
item.options=this.networkStateOptions ;
break;
default:
break;
}
returnitem;
});
this.name="ceshi";
console.log(5555);
console.log(this.netState.chainNetworkState);
console.log(this.searchForm);
},
networkCommonData() {
// commonComboData(commonCombo).then(res => {
// console.log(res);
// this.commonQuery = res.data.data;
// this.networkStateOptions = this.commonQuery.chainNetworkState;
// this.searchForm = networkBaseForm.map(item=> {
// switch (item.label) {
// case "网点状态":
// item.options = this.networkStateOptions;
// break;
// default:
// break;
// }
// return item
// return Object.assign(item, { options: this.networkStateOptions });
// });
// console.log(this.networkStateOptions);
// console.log(this.searchForm);
// });
}
}
};
</script\>
上个代码看一下