React的map方法里添加条件渲染(包括三元判断)

前期装备

html中使用React

正常map代码：

let array1 = ['张三', '李四','王二'];
let oDiv = document.getElementById('app');

ReactDOM.render(
       <div>
           {
                array1.map((e, i, arr) => 
                <div key={i}>
                    <h4>name = { e }</h4>
                    <h4>id = { i }</h4>
                </div>
                )
            }
            </div>,
            oDiv
        );

如图

---

新需求：map里添加条件渲染

• ️如果碰到name===‘李四’，就过滤掉不展示

 ReactDOM.render(
       <div>
       {
           array_name.map((e, i, arr) =>
               e === '李四' ?  <div key={i}</div>:
               <div key={i}>
                   <h4>element = { e }</h4>
                   <h4>index = { i }</h4>
               </div>
           )
       }
       </div>,
       oDiv
   );

如图

tian