CaseyWei

一、什么是useContext在Hooks出来之前，开发者都是使用的class组件，通过props传值。现在使用方法组件（Function）开发了，没有constructor构造函数也就没有了props的接收，所以父子组件的传值就成了一个问题。React Hooks就为我们准备了useContext来解决这个问题。二、useContext的作用1.useContext可以帮助我们跨越组件层级直接传递变量，实现数据共享。这里要注意的是，很多同学觉得可以使用useContext结合useR

官网的代码import React, { useState, useEffect } from 'react';function FriendStatus(props) { const [isOnline, setIsOnline] = useState(null); useEffect(() => { function handleStatusChange(status) { setIsOnline(status.isOnline); } Ch...

状态是隐藏在组件中的信息，组件可以在父组件不知道的情况下修改其状态。我更偏爱函数组件，因为它们足够简单，要使函数组件具有状态管理，可以useState()Hook。本文会逐步讲解如何使用useState()Hook。此外，还会介绍一些常见useState()坑。1.使用 `useState()` 进行状态管理无状态的函数组件没有状态，如下所示(部分代码)：可以找 codesandbox 尝试一下。运行效果：这时，要如何添加一个按钮来打开/关闭灯泡呢？为此，咱们需要具有状...

状态是隐藏在组件中的信息，组件可以在父组件不知道的情况下修改其状态。我更偏爱函数组件，因为它们足够简单，要使函数组件具有状态管理，可以useState()Hook。本文会逐步讲解如何使用useState()Hook。此外，还会介绍一些常见useState()坑。1.使用 `useState()` 进行状态管理无状态的函数组件没有状态，如下所示(部分代码)：可以找 codesandbox 尝试一下。运行效果：这时，要如何添加一个按钮来打开/关闭灯泡呢？为此，咱们需要具有状...

Create React App是FaceBook的React团队官方出的一个构建React单页面应用的脚手架工具。它本身集成了Webpack，并配置了一系列内置的loader和默认的npm的脚本，可以很轻松的实现零配置就可以快速开发React的应用。Quick Start（快速入门）全局安装首先确保你电脑上安装最新的# 全局安装npm install -g create-react-app# 构建一个my-app的项目npx create-react-app my-appc.

1.下载并添加Redux DevToolsChrome:下载地址：https://chrome.google.com/webstore/detail/redux-devtools/lmhkpmbekcpmknklioeibfkpmmfibljdFirefox:下载地址：https://addons.mozilla.org/en-US/firefox/addon/remotedev/...

redux 与 react-redux 直接一起使用， 让我总分不清楚这两个各自的职责，分别整理一下。reudx redux.jpg对于redux 整个过程如上所示。...

列表数据在项目中很常见，身为前端工程师的你几乎天天都要与列表数据打交道，像新闻列表、用户列表、流水列表等等。本篇文章主要讨论在React.js中如何渲染列表数据。1、将元素放到数组中直接渲染之前曾经说过，一个数组直接放到JSX当中，那么会被直接展开。那么数组里直接存放元素内容呢？示例：class Book extends React.Component{ render()...

class Button extends React.Component { constructor(props) { super(props); this.state = {data: 0}; } setNewNumber() { this.setState({data: this.state.data + 1}) // this为undefi...

组件的生命周期可分成三个状态：Mounting：已插入真实 DOM Updating：正在被重新渲染 Unmounting：已移出真实 DOM生命周期的方法有： componentWillMount在渲染前调用,在客户端也在服务端。 componentDidMount: 在第一次渲染后调用，只在客户端。之后组件已经生成了对应的DOM结构，可以通过this.getDOM...

当你通过后台拿到数据，而这个数据是带标签的字段，跟vue框架中的v-html指令功能一样场景：例如后台富文本编辑器编写的一些文章然后生成html，然后接口返回给c端显示<!-- publishData的值是一段html，比如：<p>我是后台传过来的html数据，请把html渲染到页面</p> --><div dangerouslySetIn...