vue路由跳转清空数据

修改和添加都是使用的同一个页面，在修改页直接跳转到添加页时页面数据不清空

问题代码❌

created() { this.init() }, methods: { init(){ if(this.$route.params && this.$route.params.id){ //从路径获取id值 const id = this.$route.params.id //调用根据id查询的方法 this.getInfo(id) }else { //如果没有值则清空表单 this.teacher= {} } } }

原因是created（）在页面渲染之前执行一次，执行一次后不再加载了。

解决办法⚡️加上路由监听使每次跳转后都会触发init()方法进行判断清空表单

created() { this.init() }, watch: { //监听 $route(to, from) { //路由变化方式，路由发生变化，方法就会执行 this.init() } }, methods: { init(){ if(this.$route.params && this.$route.params.id){ //从路径获取id值 const id = this.$route.params.id //调用根据id查询的方法 this.getInfo(id) }else { //如果没有值则清空表单 this.teacher= {} } } }