如果我的相机组件回传一些错误，我想显示一个快餐栏通知。我试图将组件放在一个函式中并将错误讯息作为道具传递，并在 if 陈述句中呼叫它但没有用。我还尝试回传小吃店本身，也没有显示出来，而 console.log 或警报讯息在这两种方式下都可以正常作业。我没有显示代码的某些部分，因为它是私有的，我只显示有关小吃店的部分。无论如何，如果只是在snackBar 函式中放置一些console.log 或alert，它会很好地回传它。问题出在小吃店。这是我的代码：

    import React from 'react'
    import Snackbar from '@mui/material/Snackbar'
    
    const Camera = () => {
  const [open, setOpen] = useState(false)
        const snackBar = (errorMessage) => {
            setOpen(true)
            return <Snackbar open={open} message={errorMessage} />
        }

        let callback = {
                    error: function (error) {
                    console.log(error)
                    if (error.code === 100) {
                        return snackBar('error occured')
                    } 
                    } else if (error.code === 104) {
                        console.log('104')
                        return snackBar('Please don't move the phone')
                    } else if (error.code === 105) {
                        console.log('105')
                        setOpen(true)
                        return snackBar('Try again')}
                },
         }
return (
    
       <div>
         <h1>Camera</h1>
       </div> 
)

}

汇出默认相机

uj5u.com热心网友回复：

您没有在任何地方呼叫回呼或snackBar，也没有在任何JSX 中回传。你也忘记了 import useState。

如果您的意图是提供一个回呼来处理错误（例如在获取时），然后显示小吃栏，这里是一个如何使用（非常粗略的伪代码）回呼示例的示例

import { Snackbar } from "@mui/material"
import { useState } from "react"

const Camera = () => {
  const [errorMessage, setErrorMessage] = useState(null)

  const callback = (error) => {
    if(error.code === '100') {
      setErrorMessage('Message 100')
    } else if(error.code === '105') {
      setErrorMessage('Message 105')
    } // ... add all your other else-ifs here
  } 

  return (
    <div>
      <h1>camera</h1>
      {errorMessage && <Snackbar open={errorMessage} message={errorMessage} />}
    </div>
  )
}