全局组件中如何针对个别页面添加功能？

Question

比如说一个公共组件，有十几个画面在用，但是针对其中一个画面要做一些修改，我目前是想按下面的伪代码这样做：

const onChange = () => {
    if (targetPage) {
        // 个别画面
        callTargetFoo();
    } else {
        // 其它的画面
        callGlobalFoo();
    }
}

想请教下这种情况下有更优雅的编码方式吗？

Answer 1

可以用控制反转，每个页面在调用组件时传入对应的方法，然后组件内部执行传入的方法，而不用关心是哪个页面。

如果不想每个页面都改，可以把通用的方法作为默认值，这样只用改一个页面。
从性价比的角度来说，如果只有一个页面要改，用if else也是可以的，但要注意以后需求膨胀时，尽快切换到上述方案