代码如下:
const News = () => {
return (
<div>
<span className={styles.a}>
{hourTgdz[0] == '1' ? '东' : null}
{hourTgdz[0] == '2' ? '南' : null}
{hourTgdz[0] == '3' ? '西' : null}
{hourTgdz[0] == '4' ? '北' : null}
</span>
<span className={styles.b}>
{rgz[0] == '1' ? '东' : null}
{rgz[0] == '2' ? '南' : null}
{rgz[0] == '3' ? '西' : null}
{rgz[0] == '4' ? '北' : null}
</span>
<span className={styles.c}>
{ygz[0] == '1' ? '东' : null}
{ygz[0] == '2' ? '南' : null}
{ygz[0] == '3' ? '西' : null}
{ygz[0] == '4' ? '北' : null}
</span>
<span className={styles.d}>
{ngz[0] == '1' ? '东' : null}
{ngz[0] == '2' ? '南' : null}
{ngz[0] == '3' ? '西' : null}
{ngz[0] == '4' ? '北' : null}
</span>
</div>
<div>
<span className={styles.all}>
// 如果rgz[0]的值与hourTgdz[0]的值一样(即都为‘东’或都为‘南’等),则这个span盒子里显示‘方向’二字
{rgz[0] == hourTgdz[0] ? '方向' : null}
// 如果类名为b的span盒子里的值为‘东’,类名为c的span盒子里的值为‘南’,则这个span盒子里显示‘文’二字
// 如果类名为b的span盒子里的值为‘西’,类名为d的span盒子里的值为‘北’,则这个span盒子里显示‘武’二字
// 按以上两个判断条件,请问以下两判断式的正确写法是什么?
// {rgz[0].value=='东' ygz[0].value=='南' ? '文' : null}
// {rgz[0].value=='西' ngz[0].value=='北' ? '武' : null}
</span>
</div>
)
}
请问最后一个span盒子里的判断式如何写才正确?请在现有代码基础上展示说明,谢谢
不知道你这个问题是否已经解决, 如果还没有解决的话:对于这个问题,你可以使用JavaScript中的三元运算符和逻辑操作符来进行判断。以下是一个示例代码:
return (
<div>
<span>{this.state.show ? '显示' : '隐藏'}</span>
{this.state.condition === 'a' ? <span>条件a</span> :
this.state.condition === 'b' ? <span>条件b</span> :
this.state.condition === 'c' && this.state.condition2 === 'd' ? <span>条件c和条件d同时成立</span> :
<span>其他条件</span>}
</div>
);
在这个示例中,使用了逻辑操作符&&来实现多条件判断。当this.state.condition
等于"c"并且this.state.condition2
等于"d"时,会渲染出"条件c和条件d同时成立"这个span标签,否则会渲染出"其他条件"这个span标签。你也可以用||运算符来实现多个条件中只要满足一个就渲染相应的标签。
希望这个示例能够帮助你解决问题!