ant design pro of vue自定义了编辑modal,当点击编辑按钮时,第一次获取不到值。但是第二次点就有值了,并且浏览器有警告
You cannot set a form field before rendering a field associated with the value. 大概是说不能再渲染前对field进行赋值,解决办法如下:
this.$nextTick(() => {
this.form.setFieldsValue({
name: record.name,
memo: record.memo,
id: record.id
})
})
nextTick大概可以理解为
在created()
钩子函数执行的时候DOM 其实并未进行任何渲染,而此时进行DOM操作无异于徒劳,所以此处一定要将DOM操作的js代码放进Vue.nextTick()
的回调函数中。与之对应的就是mounted()
钩子函数,因为该钩子函数执行时所有的DOM挂载和渲染都已完成,此时在该钩子函数中进行任何DOM操作都不会有问题 。