地图左上角的反应叶大括号

Question

当地图距离太远时，我可以在缩放窗格附近使用花括号和符号。我该如何摆脱它们？

ps.s。提供了一些代码

ps.s。 2-当我添加条件时{condition1 && condition2 &&它显示了方括号和零。在离开条件下如何避免呢？

return (

    <LeafMap
        preferCanvas={true}
        ref={mapRef}
        zoom={zoom}
        center={[deviceCoordinatesLat, deviceCoordinatesLong]}>
        <TileLayer url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
                   attribution="&copy; <a href=&quot;http://osm.org/copyright&quot;>OpenStreetMap</a> contributors"/>

        {condition1 && condition2 &&
        <Control position="topright">
            <div className="notification-circle">
                <img src={notificationRedCircle}/>
                <p>{countOfCondition2}</p>
            </div>
        </Control>}

        {markers.map(item => (
            <Marker
                className={item.id}
                key={item.id}
                position={[item.coordinates[0], item.coordinates[1]]}
                icon={
                    new L.Icon({
                        iconUrl: require('../../../frontend/src/images/map/1.png'),
                        iconSize: new L.Point(15, 15),
                    })
                }
            >
            </Marker>
        ))}
    </LeafMap>
)
};

export default Map

Answer 1

这是一个很奇怪的问题，但是它可能位于使用多个{和}嵌套的情况下。因此，解决此问题的一种可能方法是在JSX之外评估您的状况，然后在其中放入一个值。

所以给这个镜头：

const conditionEval = condition1 && condition2;

return(
  ...
  {conditionEval &&
    <Control position="topright">
        <div className="notification-circle">
            <img src={notificationRedCircle}/>
            <p>{countOfCondition2}</p>
        </div>
    </Control>
  }
  ...
)

Answer 2

由于@SMAKSS，我开始重新检查所有代码，发现：-我的病情未评估为布尔值-这就是为什么0-我在代码中输入了一个多余的括号

感谢大家的努力！