React
AdleyTales
这个作者很懒,什么都没留下…
展开
-
react hooks中的 useReducer
useReducer是React提供的一个高级Hook,它不像useEffect、useState、useRef等必须hook一样,没有它我们也可以正常完成需求的开发,但useReducer可以使我们的代码具有更好的可读性、可维护性、可预测性。下面我们会分三篇文章详细介绍如何在项目中使用useReducer:第一篇:主要介绍JavaScript中reducer的概念以及它的特点,对reducer、redux等比较熟悉的小伙伴可以跳过本篇第二篇:主要介绍useReducer的使用方式和它的场景,以及u原创 2020-10-14 17:39:21 · 1310 阅读 · 0 评论 -
react中使用context数据通信 useContext
创建三个组件Father 父组件Son 子组件Gson 孙组件// Fatherimport React, {useState} from 'react';import Son from 'views/Son/index.jsx'import context from 'utils/context'export default function Father () { const [count, setCount] = useState(10000) const handle原创 2020-10-14 16:40:48 · 695 阅读 · 1 评论 -
react 跨组件非父子数据通信 events eventBus事件通信
1、安装events yarn add events --dev2、简单封装个eventBus的工具库/* utils/eventBus.js */import { EventEmitter } from 'events'export default new EventEmitter()3.例子应用Comp1 组件1import React from 'react';import Bus from 'utils/eventBus'export default funct原创 2020-10-14 14:58:08 · 900 阅读 · 0 评论 -
react项目中import使用绝对路径
在项目的根目录下创建jsconfig.json文件{ "compilerOptions": { "baseUrl": "src" }, "include": ["src"]}重启项目使用原创 2020-10-14 14:43:08 · 2049 阅读 · 1 评论 -
webpack4 搭建react babel7遇到坑 【解决】
webpack4 react 搭建:babel升级到7 webpack编译的时候发生很多报错// 搭建环境 webpack4 babel7// install webpacknpm i webpack webpack-cli webpack-dev-server -g//install react npm i react react-dom -S// install babe...原创 2018-11-22 23:31:12 · 4165 阅读 · 0 评论 -
create-react-app 2.x 中css 模块化
# 1 css文件写成 xxx.module.css 如果使用sass 写成 xxx.module.scss.test h3 { color:rgba(166, 169, 253, 1.000);}# 2 组件中引入import React, { Component } from 'react';import styles from './aaa.module.css'clas...原创 2019-01-18 12:43:37 · 717 阅读 · 0 评论 -
vscode react自动补全html标签
第一步,打开用户设置code–首选项–设置或commoand + ,第二步,搜索includeLanguagesincludeLanguages第三步,点击settings.json加上下面代码,保存即可"emmet.includeLanguages": { "javascript": "javascriptreact"}...原创 2019-05-10 09:13:12 · 1818 阅读 · 0 评论