问题描述:

使用vue的表单组件,编辑页面设置默认值失败,其他表单项目均设置成功,只有图片地址的input值无法成功渲染

问题解决流程:

仔细对比该表单项目与其他表单项目,以及结合之前angular的经验,猜测可能是v-if影响了数据的绑定,去除v-if后数据成功渲染

问题出现原因:

该表单项目使用了v-if(条件默认为false),因为生命周期的原因,数据第一次无法

渲染

step1. v-if条件为假,表单元素在html中没有生成

step2. 数据绑定,找不到该表单元素的dom,数据渲染失败

step3. v-if条件修改为真,表单元素在html中生成

解决方案:

使用v-show