小编Chi*_*Chi的帖子

我正在尝试解决 React Native 导航的错误Non-serializable values were found in the navigation state. Alert > params.action[0].onPress (Function)。我不认为该函数没有像错误指出的那样传递给参数，但每次我按下图标时它都会返回相同的错误。如果有任何建议或意见，我将不胜感激。

export default function Alert({ route, navigation }) {
  const { colors } = useTheme();
  const { t } = useTranslation();
  const { title, message, action, option, type } = route?.params;
  const success = type === "success";
  useEffect(() => {
    const backHandler = BackHandler.addEventListener(
      "hardwareBackPress",
      () => !option?.cancelable
    );

    return () => backHandler.remove();
  }, [option?.cancelable]);

  const renderButtonFirst = () => {
    const firstTitle = …

我制作了一个 MessageBanner 组件，并想从中制作多个横幅，例如 MessageSuccess（绿色主题）和 MessageError（红色主题）。我尝试传递背景颜色、文本颜色和边框颜色的类名，但没有成功。请帮忙。

这是 MessageBanner.tsx。

export const MessageBanner: VFC<Props> = memo(props => {
  const { title, description, bgColor, textColor, borderColor } = props
  return (
    <>
      <div
        className={`${bgColor} ${textColor} ${borderColor} pointer-events-autoborder-t-4 rounded-b  px-4 py-3 shadow-md duration-1000`}
        role='alert'
      >
        <div className='flex'>
          <div>
            <p className='font-bold'>{title}</p>
            <p className='text-sm'>{description}</p>
          </div>
        </div>
      </div>
    </>
  )
})

这是 MessageSuccess 组件。我尝试不使用“.”，例如使用“bg-green-100”而不是“.bg-green-100”，但都没有成功。

export const MessageSuccess: VFC = () => {
  return (
    <MessageBanner
      title='Welcome Back'
      description='You have successfully logged in'
      bgColor='.bg-green-100'
      textColor='.green-900'
      borderColor='.border-green-500'
    />
  )
} …