一个页面两个功能 共用一个组件，但是希望组件有各自的实例。如何做到呢？

Question

如图，我希望两个“课中检测”共用一个 .vue组件。但是希望进入它们的页面后的行为互不影响，现在是，进入一个操作了，切换到另一个，发觉还是前面的操作结果。

怎么解决呢？

Answer 1

定义不同的name ,<router-view :key="$route.name"></router-view>

Answer 2

你可能是不同的路由对应了同一个组件的问题吧
这个没什么办法 要么用watch监听路由 同一个组件切换的话重置一下状态
要么就用导航守卫，跳转的时候重置一下状态
据我所知不同路由导航到同一个组件 data层的东西是不会变化的

Answer 3

组件封装一下再调用

Answer 4

1，关于互不影响的问题： 只要vue组件的data声明为返回一个初始数据对象的函数，而不要定义为一个对象，组件就不会有影响
2, 关于通用化组件的问题：ａ，组件通过props来传递数据 b,通过插槽slot