Vue项目中，两个十分相似的页面应该用什么方案解决代码复用的问题？

Question

目前我想到两个处理办法：
1.写2个vue组件，然后把公共的部分抽出来，供两个vue组件使用，最终2个页面分别指向这2个组件
2.写1个vue组件，通过判断路由的方式，动态展示不同的内容。
请问哪种方案更好，为什么？（如果有更好的方案，还请不吝分享，谢谢）

Answer 1

页面级别或者以路由为单位的组件，建议都单独写一个文件，无论功能是否相同。这样后期维护才不会有负担。

然后再说如果两个页面功能相似，需要考虑是否封装公共方法和公共组件。

最后的效果就是，如果有两个路由，那么我的文件夹里对应就有两个分别指向这两个路由的文件（Login.vue, SignUp.vue），但是这两个文件内部可能用的是同一个公共组件，只是数据来源不同而已。

Answer 2

看业务逻辑，如果业务逻辑一样，可以用同一个组件。如果说业务逻辑稍微有一点不一样可以写一些 if-else；如果说业务逻辑差别比较大的可以用 extend 然后覆写的方式。

Answer 3

使用方案1，抽离公共部分/组件。主要考虑到后期迭代，某个组件要添加新的特性，另一个不用添加，
随着时间推移 代码里面的if else 会越来越多。