我是箭头功能的新手,我正在为用户开发一个应用程序,我正在使用react模板,因为在我的应用程序中也有登录和注销系统,并且我将注销按钮放在该模板的页脚中,并且我遇到了一个问题用户访问网站,然后在登录用户之前看到注销按钮,因为该按钮位于页脚中,所以我要根据 session 中存储的电子邮件消失注销按钮,这意味着如果 session 中有用户电子邮件,则注销按钮出现在页脚中否则,用户看不到注销按钮是页脚的代码
import React from 'react';
import PropTypes from 'prop-types';
const email = session.getitem('user.email');
const FooterText = (props) => (
<React.Fragment>
<br/><br/>
<div className="hr-text hr-text-center my-2" >
// i want to put check here that if session have user email then show that button other vise disappear
<button onClick={logout}>Logout</button>
</div>
© { props.year } All Rights Reserved.
Designed and implemented by{' '}
<a
href="http://aliraza"
target="_blank"
rel="noopener noreferrer"
className="sidebar__link"
>
ali raza
</a>
</React.Fragment>
)
FooterText.propTypes = {
year: PropTypes.node,
name: PropTypes.node,
desc: PropTypes.node,
};
FooterText.defaultProps = {
year: "2020",
name: "Admin Theme",
desc: "Bootstrap 4, React 16 (latest) & NPM"
};
export { FooterText };
我想在这里检查一下,如果 session 中有用户电子邮件,则表明其他老虎钳按钮消失了,但是在箭头功能中,我正在努力使用if else语句如何做到这一点? 最佳答案
您可以像下面那样应用检查,您可以使用三元运算符检查条件
import React from 'react';
import PropTypes from 'prop-types';
const email = session.getitem('user.email');
const FooterText = (props) => (
<React.Fragment>
<br/><br/>
<div className="hr-text hr-text-center my-2" >
// i want to put check here that if session have user email then show that button other vise disappear
{email?(<button onClick={logout}>Logout</button>):null}
</div>
© { props.year } All Rights Reserved.
Designed and implemented by{' '}
<a
href="http://aliraza"
target="_blank"
rel="noopener noreferrer"
className="sidebar__link"
>
ali raza
</a>
</React.Fragment>
)
FooterText.propTypes = {
year: PropTypes.node,
name: PropTypes.node,
desc: PropTypes.node,
};
FooterText.defaultProps = {
year: "2020",
name: "Admin Theme",
desc: "Bootstrap 4, React 16 (latest) & NPM"
};
export { FooterText };