JSX花括号表达式中的花括号表达式

Question

我在主表达式中有以下子表达式，它被标记为错误。如果去掉内部的花括号，也会出错。

{!isNonParticipatingUser(props) 
&&
<LinkContainer to="/contactUs">
<Dropdown.Item href="#">Contact Us</Dropdown.Item>
</LinkContainer>
{props.appData && props.appData.appProperties
&&
<Dropdown.Item target="_blank" href={getAppPropertiesValue(props, 'link.employee.faq')}>FAQs
</Dropdown.Item>
}
}

Answer 1

try this

return(
<>
{!isNonParticipatingUser(props) 
&&
<>
<LinkContainer to="/contactUs">
<Dropdown.Item href="#">Contact Us</Dropdown.Item>
</LinkContainer>
{props.appData && props.appData.appProperties
&&   
<Dropdown.Item target="_blank" href= getAppPropertiesValue(props, 'link.employee.faq')}>FAQs
</Dropdown.Item>
}
</>
}
</>
);