Learn how to use the ‘branch’ and ‘renderNothing’ higher-order
components to render nothing when a certain prop condition is
met. Sometimes you only want to render a component when valid
props exist or are in a certain condition; ‘renderNothing’ is
an easy way to completely remove the component when you don’t
need to show it.

const userIsNotActive = ({ status }) => status !== 'active';
const hideIfNotActive = branch(userIsNotActive, renderNothing); const FeaturedUser = hideIfNotActive(({ name, status }) =>
<div>
<h3>Today's Featured User</h3>
<User name={ name } status={ status } />
<hr />
</div>
);

[Recompose] Render Nothing in Place of a Component using Recompose的更多相关文章

  1. [Recompose] Refactor React Render Props to Streaming Props with RxJS and Recompose

    This lesson takes the concept of render props and migrates it over to streaming props by keeping the ...

  2. [Recompose] Set the HTML Tag of a Component via a Prop using Recompose

    Learn how to user the ‘componentFromProp’ helper and ‘defaultProps’ higher order component to swap t ...

  3. [Recompose] Add Lifecycle Hooks to a Functional Stateless Component using Recompose

    Learn how to use the 'lifecycle' higher-order component to conveniently use hooks without using a cl ...

  4. [React Router v4] Conditionally Render a Route with the Switch Component

    We often want to render a Route conditionally within our application. In React Router v4, the Route ...

  5. [Recompose] Add Local State to a Functional Stateless Component using Recompose

    Learn how to use the 'withState' and 'withHandlers' higher order components to easily add local stat ...

  6. [React Router v4] Render Catch-All Routes with the Switch Component

    There are many cases where we will need a catch-all route in our web applications. This can include ...

  7. [Recompose] Handle React Events as Streams with RxJS and Recompose

    Events are the beginning of most every stream. Recompose provides a createEventHandler function to h ...

  8. [Recompose] Configure Recompose to Build React Components from RxJS Streams

    Recompose provides helper functions to stream props using an Observable library of your choice into ...

  9. React-代码复用(mixin.hoc.render props)

    前言 最近在学习React的封装,虽然日常的开发中也有用到HOC或者Render Props,但从继承到组合,静态构建到动态渲染,都是似懂非懂,索性花时间系统性的整理,如有错误,请轻喷~~ 例子 以下 ...

随机推荐

  1. 洛谷 P1217 [USACO1.5]回文质数 Prime Palindromes

    P1217 [USACO1.5]回文质数 Prime Palindromes 题目描述 因为151既是一个质数又是一个回文数(从左到右和从右到左是看一样的),所以 151 是回文质数. 写一个程序来找 ...

  2. 【直接拿来用のandroid公共代码模块解析与分享】の Notification和NotificationManager

    本文源代码托管在https://github.com/ASCE1885/asce-common,欢迎fork Android项目做得多了.会发现原来非常多基础的东西都是能够复用,这个系列介绍一些自己项 ...

  3. 【开卷故意】JAVA正則表達式模版

    专业既然是机器学习.那工作肯定也是继续和数据打交道,那么问题来了,非常多时候推荐算法和数据挖掘算法都是现成可用的,平台初建,重点还在数据过滤和抽取.如何高效的抽取数据? 利用往常算法比赛中经常使用的字 ...

  4. 基于TC技术的网络流量控制实战

    本文转载在:http://server.it168.com/a2010/0426/878/000000878406.shtml 基于TC技术的网络流量控制实战 650) this.width=650; ...

  5. uiautomator——第一个例子:打开浏览器,输入网址

    1.在sdk安装目录:E:\Test_Tools\auto_test\app\adt-bundle-windows-x86-20131030\sdk\tools下启动uiautomatorviewer ...

  6. 安装Mysql最新版本mysql-5.7.10-winx64出现的几个问题解决

    电脑是64位的安装不了Windows (x86, 32-bit),Mysql installer MSI ,然后下载了Windows (x86, 32-bit), ZIP Archive 这种是免安装 ...

  7. 洛谷 P1480 A/B Problem

    P1480 A/B Problem 题目描述 输入两个整数a,b,输出它们的商(a<=10^5000,b<=10^9) 输入输出格式 输入格式: 两行,第一行是被除数,第二行是除数. 输出 ...

  8. 本地 oracle 安装文件夹满触发 ORA-7445 [_memmove()+64] 导致Instance Crashed 的事故

    近期处理了一个问题,原因是因为命中ORA-600 [kole_t2u], [34] - description, bugs 导致 在udump 文件夹下大量转储 出cdmp 文件, 然后这些 cdmp ...

  9. js进阶 14-8 表单序列化函数serializeArray()和serialize()的区别是什么

    js进阶 14-8 表单序列化函数serializeArray()和serialize()的区别是什么 一.总结 一句话总结:两者都是对表单进行序列化,serializeArray()返回的是json ...

  10. 1.JPA概要

    转自:https://www.cnblogs.com/holbrook/archive/2012/12/30/2839842.html JPA定义了Java ORM及实体操作API的标准.本文摘录了J ...