React
Mac系统下环境变量 1、注入环境变量，export NODE_ENV=development
package.json
{ "scripts": { "dev": "export NODE_ENV=development && webpack serve", "build": "export NODE_ENV=production && webpack" }, } 2、使用环境变量 process.env.NODE_ENV
webpack.config.js
const path …
创建项目 # 创建项目目录 $ mkdir hello-world # 进入项目目录 $ cd hello-world # 初始化 package.json 文件 $ npm init -y # 创建源码src目录（所有源代码都放在src目录），并创建入口文件 index.js $ mkdir src && touch index.js # 安装react和react-dom $ npm install react react-dom # 安装babel-loader，用于处理js文件 # 安装@babel/preset-react，用于处理jsx $ npm install …
安装 $ npm install screenfull React中使用screenfull 1、引入
import screenfull from 'screenfull'; 2、全屏
const handleClick = () => { if (screenfull.isEnabled) { //全屏整个页面 //screenfull.request(); //全屏某个元素 screenfull.request(element); } }; 3、切换
const handleToggle = () => { if (screenfull.isEnabled) …
useState import React, { useState } from 'react'; function Counter() { const [count, setCount] = useState(0); return ( <div> <p className='title'>You clicked {count} times</p> <br /> <button onClick={() => setCount(count + 1)}>Click me</button> …
初始化 $ mkdir react-ts-app $ cd react-ts-app $ npm init -y $ npm install react react-dom $ mkdir src $ cd src $ touch index.html $ touch App.tsx src/index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" …
高阶组件（HOC），High Order Component。 高阶组件（HOC）是 React 中用于复用组件逻辑的一种高级技巧。HOC 自身不是 React API 的一部分，它是一种基于 React 的组合特性而形成的设计模式。
高阶组件是参数为组件，返回值为新组件的函数。
class NoteList extends React.Component { constructor(props) { super(props); } render() { return ( <div className="list"> { …
Prev
2/2