reactjs - React 上下文提供程序中的意外令牌“<”

Question

我正在尝试在 React App 中实现语言上下文，但是当我尝试将一些元素传递给 value 道具时，它不起作用。

错误是：第 2:2 行中的意外令牌（即）。但是标签很好地关闭了。我是否遗漏了绝对需要的有价值的东西？

const LanguageProvider = ({ children }) => (
  <LanguageContext.Provider value={{
    setLanguage,
    translations
  }}
  >
    {children}
  </LanguageContext.Provider>
);

setLanguage 来自：

const [language, setLanguage] = useState('en_US');

并且翻译等于字符串对象：

const translations = {
    en_US: {
      settings: {
        menu: 'Main Menu',
        screen: 'Screen'
      }
    },
    es_MX: {
      settings: {
        menu: 'Menú Principal',
        screen: 'Pantalla'
      }
    }
};

标签： reactjsreact-context

Answer 1

标签没问题，你只需要移动setLanguage到LanguageProvider.

const LanguageProvider = ({ children }) => {
    const [language, setLanguage] = useState("en_US");

    return (
        <LanguageContext.Provider
            value={{
            setLanguage,
            translations
            }}
        >
            {children}
        </LanguageContext.Provider>
    );
};

我有一个沙盒，你可以试试。