我正在参加「掘金·启航计划」
一、问题描述
在文章列表点击某篇文章的编辑:
在编辑界面点击写文章:
虽然跳转到了「新增文章」页面,但是「编辑文章」界面的内容未被清除。
尝试如下方法无效:
在 mount() 内,即在组件挂载后
(1)清空表单:model绑定的数据模型
(2) 使用Ant <a-form-model>自带的resetFields()
二、问题分析
Vue 如果检测到跳转的是同一个页面,那么之前的数据将不会被刷新掉,而是缓存起来。
三、解决方案
在当前路由组件的父级,即<router-view>标签内添加一个:key="route.fullpath"。「更新文章」页面->「新增文章」时Vue 便不会判定为同一页面,也就不会缓存之前的结果了。
四、总结
补一补Vue Router、Vue 缓存机制、Vue 生命周期相关知识点。