如何为SweetAlert的确认按钮添加点击事件处理函数

解法 #

你当前使用的onClick是作用于整个弹窗组件的全局点击事件，并不是确认按钮专属的触发回调，要绑定确认按钮的点击事件，改用onConfirm属性即可，示例修改如下：

{ magic.errorMessage && <SweetAlert
              title="Error"
              show={true}
              html={magic.errorMessage}
              type="error"
              showCancelButton={false}
              showConfirmButton={true}
              onConfirm={() => { 
                console.log("YES YES YES")
                // 此处添加清空错误提示的逻辑，修改magic对应的状态即可
                // 示例：setMagic(prev => ({...prev, errorMessage: null}))
              }}
            />
          }

你当前是通过magic.errorMessage的取值控制弹窗显隐，所以在onConfirm回调里把magic.errorMessage重置为空后，弹窗会自动消失，也完成了错误提示的清除逻辑。

内容的提问来源于stack exchange，提问作者1977