在onClick事件之后，UseState不会重新呈现页面

Question

通过useState挂钩设置状态后重新呈现页面有问题。状态值更改，但页面不重新呈现。

export function langauge(props: Props) {
  const [languageChange, setLanguageChange] = React.useState(strings.getLanguage());

return (
        {props.selected !== 'EN' && (
          <MenuItem onClick={() => {
            locale.changeLanguage('en'),
            setLanguageChange('en')
          }}>English - EN</MenuItem>
         {props.selected !== 'FR' && (
          <MenuItem onClick={() => {
            locale.changeLanguage('fr'),
            setLanguageChange('fr')
          }}>French - FR</MenuItem>
        )} );
}

我想重新翻译语言变化的页面。

Answer 1

您的页面没有重新渲染，因为您实际上并没有根据状态变量languageChange有条件地渲染内容。你有条件地渲染基于props.selected。

更改

{props.selected !== 'EN' && <Component />

至

{languageChange !== 'EN' && <Component />

它会起作用。