条件渲染以选择显示设置



更新

我找到了一个不同的解决方案——页面";响应性";不起作用。添加后:<meta name="viewport" content="width=device-width, initial-scale=1.0">正如@adbala rama krishna在另一个问题中所暗示的那样,它正在按我的意愿运行。链路

不管怎样,如果有人能解决语法问题,我会很高兴听到的


在我的react应用程序中,我试图更改移动或桌面的显示,并在需要时添加列:

{isTabletOrMobile
? <br />
: <></Col><Col></>
}

完整页面代码:链接

(此处使用react引导程序..)

因为结束标记在开始标记之前,所以会引发语法错误。

它周围有没有?

也许有更好的方法??

谢谢大家!

如果您想有条件地呈现列,那么您必须这样做。

<Row>
{isTabletOrMobile
? <Col>1</Col>
:<><Col>1 of 2</Col>
<Col>2 of 2</Col></>
}
</Row>

还要注意,您必须关闭最后一列,如<Col></Col>

最新更新