- 博客(10)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 在函数组件中使用react-redux
创建redux/hooks.ts文件import {useSelector as useReduxSelector, TypedUseSelectorHook} from 'react-redux';import { RootState } from './store';export const useSelector: TypedUseSelectorHook<RootState> = useReduxSelector;store.js文件const store = cr
2021-04-22 18:19:25
1373
原创 类组件中使用react-redux
react-redux 官网地址：https://react-redux.js.org/安装react-reduxnpm install react-redux在index.tsx文件中，引入react-reduximport store from './redux/store';import {Provider} from 'react-redux';ReactDOM.render( <React.StrictMode> <Provider sto.
2021-04-22 17:28:45
1002
原创 redux的使用
设计思想（1）Web 应用是一个状态机，视图与状态是一一对应的。（2）所有的状态，保存在一个对象里面。基本原则整个应用只有唯一一个可信数据源，也就是只有一个 Store State 只能通过触发 Action 来更改 State 的更改必须写成纯函数，也就是每次更改总是返回一个新的 State，在 Redux 里这种函数称为 ReducerRedux工作流store 数据仓库，通过createStore创建状态树store，通过订阅store.subscribe将stat.
2021-04-22 12:47:07
199
原创 react event事件
event.target 事件发生的元素event.currentTarget 事件处理绑定的元素示例：import React from 'react';import style from './ShoppingCart.module.css';import { FiShoppingCart } from "react-icons/fi";interface Props{}interface State{ isOpen : boolean;}class S...
2021-04-16 17:49:47
408
原创 css module模组化
使用react最大的优势就是模组化，何为模组化，就是每个jsx或者tsx文件就被视为一个独立存在的原件，原件所包含的所有内容也同样都应该是独立存在的。但是如果我们只是使用一个简单的import关键词来import整个css文件，将会直接引入整个文件，而不是按需加载，这样处理就极有可能对css造成全局污染或者冲突，从而就无法达到我们组件化的目的了。那么从组件的角度我们应该怎么处理呢？很简单，我们只需要把import './index.css'换成 import style from './index.
2021-04-16 12:44:32
761
1
原创 给一个已经存在的react项目添加ts支持
比如一个已经存在的react项目my-appcd到my-app项目目录cd my-appnpm install --save typescript @types/node @types/react @types/react-dom @types/jest安装好依赖包后，讲my-app项目目录下的 js 文件的后缀 js 改为 tsx 就可以了...
2021-04-16 10:51:21
1901
原创 tsconfig配置文件讲解
搭建基于ts的react项目后，可以看到项目目录下有个tsconfig.json文件打开这个tsconfig.json{ "compilerOptions": { "noImplicitAny": false, //不需要显示的声明变量的类型any "target": "es5", //编译后的目标javascript版本， ES5, ES6/ES2015, ES2016, ES2017, ES2018, ES2019, ES2020, ESNext "lib":
2021-04-16 10:41:18
5781
原创 webpackChunkName
/*webpackChunkName:"register"*/ 代码分隔出来的js文件名constRegister=lazy(()=>import(/*webpackChunkName:"register"*/'./views/register'));
2021-04-15 18:11:41
3787
原创 react配置homepage并去掉sourcemap
打包build生成的文件index.html，里面的默认的路径是跟目录/ ，如果想改变路径，可以配置homepage配置homepagepackage.json文件，添加"homepage":"./"如果不想生成打包的map文件，可以将package.json文件中的nodescripts/build.js 修改为 setGENERATE_SOURCEMAP=false&&nodescripts/build.js（注意：false和&&之间不能有空格...
2021-04-15 18:08:03
1162
1
原创 react创建新项目
npm install -g create-react-app 全局安装create-react-app reactproject 新建并对react项目进行命名（注:项目名称不能有大写）或者npx create-react-app reactproject 新建并对react项目进行命名（注:项目名称不能有大写）新建项目中报错：原因：网络原因，解决办法：//换源npm config set registry https://registry.npm...
2021-04-15 17:52:26
105
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人