React Native中如何将回调代码作为参数传递给自定义Toast函数？

问题核心在于你传递回调的方式错误：

• 传递字符串："props.onPickScreen('Bar')" 只是一个字符串值，不会被当作代码执行；
• 直接传函数调用：props.onPickScreen('Bar') 会在调用showToast时立即执行，而非等待Toast隐藏时触发。

正确实现方式 #

你需要传递函数引用或者未执行的匿名函数作为参数，这样才能在Toast隐藏时触发执行。

方案1：传递匿名函数作为回调参数

修改showToast函数，直接将接收的回调参数作为onHide的执行逻辑：

function showToast(value1, value2, value3, onHideCallback) {
  Toast.show({
    text1: value1,
    text2: value2,
    position: 'top',
    type: value3,
    onHide: onHideCallback // 直接使用传递的函数引用
  })
}

// 调用时传递包裹目标逻辑的匿名函数
showToast(
  "Reservation process failed ",
  " please rescan it  ",
  "error",
  () => props.onPickScreen('Bar') // 仅当onHide触发时，这个函数才会执行
);

方案2：支持动态传递回调参数

如果需要给回调动态传参，可以让showToast额外接收参数数组，或者在匿名函数中直接携带：

function showToast(value1, value2, value3, onHideCallback, callbackParams) {
  Toast.show({
    text1: value1,
    text2: value2,
    position: 'top',
    type: value3,
    onHide: () => onHideCallback(...callbackParams) // 展开参数执行回调
  })
}

// 调用示例：传递函数本身+参数数组
showToast(
  "Reservation process failed ",
  " please rescan it  ",
  "error",
  props.onPickScreen, // 传递函数本身，而非立即调用
  ['Bar'] // 回调需要的参数
);

原理说明 #

• 匿名函数() => props.onPickScreen('Bar')是未执行的函数引用，只有Toast触发onHide时，该函数才会被调用；
• 直接传递props.onPickScreen（不带括号）是保留函数本身，配合参数数组可以灵活适配不同的回调场景，满足动态需求。

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