现有如下一个React应用： 我们看到App组件是类组件，因为这里用到了state。state对象有两个值，一个是输入框的text值，一个是复选框的勾选值。这个应用做的事情，...
发简信
IP属地：广东
-
React Hooks之useState（一）
-
使用React Context进行状态管理（八）在函数组件中使用useContext
React Hooks可以让我们完全抛弃类组件，让我们彻底完全函数化。其中的useContext就是用来在函数组件中使用Context的。 我们以MessageList组件为...
-
使用React Context进行状态管理（七）使用contextType移除Consumer
React 16.6中加入了一个新功能，contextType，就是不使用Consumer也能使用Provider中的共享变量。 譬如Menu.js中的UserConsume...
-
使用React Context进行状态管理（六）用Context实现通知效果
我们知道Windows系统右下角有弹窗通知，Mac系统右上角有弹窗通知，iPhone有顶部通知，Android有底部通知。如果我们想在React App中也实现这样的功能，用...
-
使用React Context进行状态管理（五）Provider与Consumer匹配
首先创建一个Context，这个Context用来提供颜色变量供子组件使用，然后创建一个Button组件，使用Context提供的颜色变量来设置它的颜色。 我们看到一共渲染了...
-
使用React Context进行状态管理（四）使用多个React Context Provider
首先确认一点，Context是可以嵌套使用的，因为Context也是Component，当然可以嵌套。 创建MessageContext.js，也就是共享Message相关的...
-
使用React Context进行状态管理（三）封装共享状态（变量）
上次说到，我们其实可以把共享的东西封装成一个组件，这样可以让我们的代码结构更加清晰。怎么做呢？在之前创建的UserContext.js文件中，创建并导出了一个Context，...
-
使用React Context进行状态管理（二）共享变量（续）
上回说到共享了变量user，我们发现还遗留了两个callback，如法炮制，把这两个callback也丢到共享环境里去。于是乎Provider变成了这个样子： 首先我们看到P...
-
使用React Context进行状态管理（一）共享变量
假设我们有如下结构的程序，App组件由Main组件和Login组件组成； Main组件由Header组件和MessageList组件组成； Header组件由Menu组件组成...