反应钩子返回中的简单条件[重复]

Posted 2023-02-21

【中文标题】反应钩子返回中的简单条件[重复]

【英文标题】：Simple conditional in react hook return [duplicate]

【发布时间】：2020-07-07 05:56:02

【问题描述】：

我刚从 react 和 hooks 开始，在与 dom 相关的返回中编写条件非常失败。我怎样才能做到这一点？人字形应根据切换进行更改。

const Description = () => 
    const t = useTranslation();
    const [isToggled, setToggled] = useState(false);
    const toggleTrueFalse = () => setToggled(!isToggled);
    return (
        <div>
            if isToggled == true 
            <ChevronRight className="arrow" size="20"/>
             else
            <ChevronDown className="arrow" size="20"/>
            
        </div>

       );
    ;
export default Description;

【问题讨论】：

你为什么不遵循基本的入门教程？它可能在第一部分

【参考方案1】：

return (
        <div>
            isToggled ? <ChevronRight className="arrow" size="20"/> :  <ChevronDown 
             className="arrow" size="20"/>

        </div>

       );

作为回报，您不能使用 if 条件。 if-else 语句在 JSX 中不起作用。这是因为 JSX 只是函数调用和对象构造的语法糖。您必须使用 才能做出有条件的决定。希望这会有所帮助！