Javascript ReactJS上下文-使用者内部的条件

使用ReactJs上下文，我在导航栏中显示了一个计数值。当值为0时，我不希望显示该值，但是我无法确定如何实现该值

基本上在计数器上下文中。我想添加一个if语句，仅当计数器>0时才显示

这是我的代码片段

<NavLink to={"/counterList"} className="nav-link" activeClassName="active">
    <span className="glyphicon glyphicon-education" /> Counter List
    <CounterContext.Consumer>
        {(c) =>
            <span className="badge badge-danger ml-10">{c.counters.filter(x => x.count > 0).length}</span>
        }
    </CounterContext.Consumer>
</NavLink>

计数器列表
{（c）=>
{c.counters.filter（x=>x.count>0）.length}
}

您可以给箭头函数一个主体

{}

，将值存储在变量中，如果它等于

0

，则返回

null

示例

<NavLink to={"/counterList"} className="nav-link" activeClassName="active">
  <span className="glyphicon glyphicon-education" /> Counter List
  <CounterContext.Consumer>
    {c => {
      const count = c.counters.filter(x => x.count > 0).length;

      return count !== 0 ? (
        <span className="badge badge-danger ml-10">{count}</span>
      ) : null;
    }}
  </CounterContext.Consumer>
</NavLink>

计数器列表
{c=>{
const count=c.counters.filter（x=>x.count>0）.length；
返回计数！==0(
{count}
)：null；
}}

Brilliant，这正是我想要的——我以为我已经尝试过了，但显然不是因为它像一个符咒一样有效，当它允许我的时候，我会接受答案to@user3284707伟大的