可在全项目复用的Alert Box，能否调用其他class中的Alert Box？

首先可以明确：可以复用其他class中已定义的Alert Box，但不建议直接原封不动调用，需要先做适配改造后再使用，避免后续出现耦合问题。

复用前需要完成的校验和改造点 #

• 先排查原有Alert Box的绑定依赖：确认现有实现有没有和所属class的专属业务逻辑、上下文状态强绑定，比如是不是只能在特定表单页、支付页调用，有没有硬编码的业务文案、固定的回调逻辑指向原有class的内部方法，如果有要先把这部分逻辑抽离成可配置参数。
• 统一入参规范：把Alert的展示标题、内容、按钮文案、点击回调、关闭逻辑、弹窗类型（成功/失败/警告/提示）都封装成可传入的参数，原有class里的专属配置可以设为默认值，不影响原有业务调用。
• 兼容多场景适配：如果项目里有PC端、移动端、内嵌H5等多端场景，要校验原有Alert的样式、交互逻辑能不能覆盖全场景，缺的适配项补全后再作为通用组件对外暴露。
• 加兜底兼容逻辑：如果原有Alert只支持异步调用，要补充同步调用的兼容方案，避免全流程里某些同步执行的场景无法调用。

改造完成后的复用方案 #

你可以把改造后的Alert Box单独抽成公共通用类，也可以直接在原有class上对外暴露一个无耦合的调用方法，示例调用逻辑参考：

// 改造后对外暴露的通用调用方法
class CommonAlert {
  // 可传入自定义配置，不传就用默认值
  static show(options = {
    title: '提示',
    content: '',
    confirmText: '确定',
    cancelText: '取消',
    onConfirm: () => {},
    onCancel: () => {}
  }) {
    // 原有Alert的渲染逻辑
  }
}

// 全流程任意位置都可以直接调用
CommonAlert.show({
  content: '操作成功',
  onConfirm: () => console.log('点击确认')
})

注意：如果原有Alert的渲染依赖特定DOM节点、全局状态，要先把这部分依赖也抽成公共逻辑，避免其他页面调用时找不到依赖报错。

内容的提问来源于stack exchange，提问作者G H Prakash