這是我的代碼:
return (
<ThemeProvider theme={props.theme}>
<section className={classes.loginForm}>
{
mode === "LOGIN"
?
<LoginForm theme={props.theme} />
<br/> <br/>
<Button variant="contained" color="primary" onClick={() => setMode("SIGNUP")}>
SIGNUP?
</Button>
:
<SignUpForm theme={props.theme} />
<br/><br/>
<Button variant="contained" color="primary" onClick={() => setMode("SIGNUP")}>
SIGNUP?
</Button>
}
</section>
</ThemeProvider>
);
錯誤出現在特征線 HTML 元素的開始標記的第一個字符處。我不明白為什么會發生這種情況,因為我在其他地方有使用相同原理的代碼并且根本沒有錯誤。
uj5u.com熱心網友回復:
花括號內的這些元素需要包裹在 a <React.Fragment />(<>和</>簡稱)
https://reactjs.org/docs/fragments.html
您的代碼:
{
mode === "LOGIN"
?
<LoginForm theme={props.theme} />
<br/> <br/>
<Button variant="contained" color="primary" onClick={() => setMode("SIGNUP")}>
SIGNUP?
</Button>
:
<SignUpForm theme={props.theme} />
<br/><br/>
<Button variant="contained" color="primary" onClick={() => setMode("SIGNUP")}>
SIGNUP?
</Button>
}
更正的代碼:
{
mode === "LOGIN"
?
<>
<LoginForm theme={props.theme} />
<br/> <br/>
<Button variant="contained" color="primary" onClick={() => setMode("SIGNUP")}>
SIGNUP?
</Button>
</>
:
<>
<SignUpForm theme={props.theme} />
<br/><br/>
<Button variant="contained" color="primary" onClick={() => setMode("SIGNUP")}>
SIGNUP?
</Button>
</>
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/365188.html
標籤:javascript 反应 jsx
上一篇:切換翻轉卡片
