Cannot read property 'resetFields' of undefined

版权声明：QAQ https://blog.csdn.net/mineblogjw/article/details/82813497

如果你也遇到这个问题，那么出现的情景应该是：vue项目中使用的element-ui组件库构建的后台管理系统之类的界面中，ADD与Edit复用同一个弹框，需要在每次点击ADD打开弹框的时候清空弹框内的from数据。（点击Edit之后数据会被获取进去，不清空就点击ADD会出现上次数据）。然后我们使用element的重置方法：然后就会报错，找不到这个方法。

this.$refs[dialogForm].resetFields();

解决方案：

this.$nextTick(()=>{
   this.$refs[dialogForm].resetFields();
});

原因：个人理解：点击add的时候弹框不存在，也就不存在这个弹框里面的form方法。所以需要将方法回调到下次dom更新的时候。具体想要探究原理的可以查看vue官方API文档。