javascript - 如何在 react,js 上显示/隐藏 bool 值元素

Question

我使用 Carousel View ，我有一些动态元素，它们应该出现在 Json 列表中。

{
        category: "Category",
        code: "421313",
        title: "Lorem Ipsum is simply dummy text of the printing and typesetting industry.",
        price: 156,
        sold: false,
        salePrice: false
      },

如您所见，我有两个 bool 值，如果该值为真，我需要在 View 上显示一些 div 元素。

               <div className={classes.card_ceromented}>
                Recommended
                </div>
              <div className={classes.card_top_product}>
                Top Product
                </div>

classes.card_top_product this element i need to show hide on bollean value.

如何在 true json 值上显示 div 元素？

我的代码:JsFiddle

Answer 1

你可以做条件渲染。

{ category.sold && (<div> This gets rendered when sold is true</div>)}

Conditional Rendering In React