1.el-select下拉框默认选中某一项不生效问题
<el-form-item label="系统类型" :label-width="formLabelWidth">
<el-select v-model="addForm.operatingsystem_type" placeholder="Linux">
<el-option v-for="(item, index) in assettype" :key="index" :label="item.label" :value="item.value"></el-option>
</el-select>
</el-form-item>
addForm:{
"asset_name": '',
"host_asset_status": '',
"operatingsystem_type":'1',
"host_description": '',
},
assettype:[
{
label:'Windows',
value:'0'
},
{
label:'Linux',
value:'1'
}
]
上边代码没有一点问题,问题出现在,在此项目此页面中,设置watch监听属性了,vue中,打开这个页面,首先会给operatingsystem_type赋值为1
computed: {
rowDataN() {
return this.rowData
}
},
watch: {
rowDataN: {
handler(newVal) {
this.addForm = {
"asset_name": newVal.asset_name,
"host_asset_status": newVal.host_asset_status,
"host_description": newVal.host_description,
}
},
deep: true,
immediate: true,
}
},
但上边代码中,计算属性会返回监听属性中rowData,而监听属性中,又会把operatingsystem_type设置为“”,所以在监听属性中需要判断一下,让它默认为1.
watch: {
rowDataN: {
handler(newVal) {
this.addForm = {
"asset_name": newVal.asset_name,
"host_asset_status": newVal.host_asset_status,
"host_description": newVal.host_description,
}
if (newVal.operatingsystem_type === "") {
this.addForm.operatingsystem_type = '1'
}
},
deep: true,
immediate: true,
}
},
2.mounted钩子函数中调方法不能传参数
getDatas(){
this.getData({"page": this.page, "limit": this.limit, data: this.realTimeData})
},
mounted () {
const _this = this
if((Object.keys(_this.selectFrom)).length == 0){
_this.timer = setInterval(_this.getDatas, 10000)
}else{
_this.timer = setInterval(_this.selectData, 10000)
}
},
如上边代码所示,在mounted钩子函数中调需要传参的方法时,需要在methods中再定义一个方法。