AS_TS的博客

一、公共环境变量二、环境变量(例如： 环境变量)在项目开发中，我们不可避免的会需要使用 环境变量，例如在定义接口 api 的 baseURL 时，会根据不同的环境，配置不同的根地址 baseURL。使用 命令创建的 react 项目，在使用 yarn run eject 命令将所有内建的配置暴露出来后，在 package.json 文件中，提供了一个 start 命令，和一个 build 命令，这两个命令在根据命令，可以在根目录的 scripts 文件夹下，找到 start.js、build.js

使用 umiJS 时出现的终端警告：WARN [WARN] update jsx: "react" into jsx: "react-jsx" to suport the new JSX transform in React 17 in tsconfig.json解决方法：确保 typescript 的依赖安装完成，随便打开一个提示错误的 .tsx 文件。macOS 使用 command + shift + p，Windows 貌似是 ctrl + shift + p。然后输入 TypeScri

1. url 传参一般跳转传递 id 都放入 url 中this.props.history.push(`/document-analysis/fans-list?id=${this.state.bloggerId}`)地址栏显示在跳转接收页 this.props.location 打印的路由参数2. state 传参跳转时需要带其他较多数据，无法在 url 上携带，可以使用 state 传值this.props.history.push({ pathname: `/document-a

document.location 这个对象包含了当前URL的信息 location.host 获取port号 location.hostname 设置或获取主机名称 location.href 设置或获取整个URL location.port设置或获取URL的端口号 location.search 设置或获document.location 这个对象包含了当前URL的信息location.host 获取port号location.hostname 设置或获取主机名称location.hre

项目创建完成后，需要使用 router 时，react-router-dom 提供了 router 服务1. 下载安装 react-router-domnpm install --save react-router-dom或yarn add react-router-dom如果使用 Typescript ，需要安装一个 react-router-dom 的声明文件，vscode 会有提示yarn add @type/react-router-dom2. 组件引用 react-router-do

使用 Typescript 搭配 react-reudx 进行数据操作，基本上按照 react-reudx 的操作进行App.tsx 文件内容import * as React from 'react'import {Provider} from 'react-redux'import {store} from './store'import Todo from './Todo'class App extends React.Component { render() {

redux 安装完成后，并能马上使用，需要进行小小的配置，有如下步骤：用了redux插件的同学，才开发者模式下，会看到这个提示，点击下划线部分，会打开介绍说明redux-devtools-extension: https://github.com/zalmoxisus/redux-devtools-extension#usage在基础使用部分，找到图中标记的部分，在store.js文件中对应位置加入即可如果使用 typescript ，在说明中也提供了方法，在下图框住部分点击上图框中的

在创建完react项目后，想使用typescript，给typescript设置了tsconfig.json后，出现了serviceWorker.js文件的报错找了以前的项目，查看了修复方式，其中config的类型报错，可以使用ts中的 type 来设置 config的类型而 process.env.PUBLIC_URL 报错，在首次编译之后会生成 react-app-env.d.ts 声明文件，错误会消失...

使用 react + antd 组件时，有时会报出 Each child in a list should have a unique "key" prop. 这样的错误这里列举几个相关的次错误报错和解决方式Table 表格解决方式：官方给 Table 组件提供了一个 rowKey 属性，用于给表格的每一行设定一个 key 值在 antd 官方文档底下也有相关解决办法：https://ant-design.gitee.io/components/table-cn/#APISelect 选

StoreStore 就是保存数据的地方，你可以把它看成一个容器。整个应用只能有一个 Store。Redux 提供createStore这个函数，用来生成 Store。import { createStore } from 'redux';const store = createStore(fn);上面代码中，createStore函数接受另一个函数作为参数，返回新生成的 Store 对象。StateStore对象包含所有数据。如果想得到某个时点的数据，就要对 Store 生成快照。这种时点

组件通讯介绍组件是独立且封闭的单元，默认情况下，只能使用组件自己的数据。在组件化过程中，我们将一个完整的功能拆分成多个组件，以更好的完成整个应用的功能。而在这个过程中，多个组件之间不可避免的要共享某些数据。为了实现这些功能，就需要打破组件的独立封闭性，让其与外界沟通，这个过程就是组件通讯组件的props（★★★）基本使用组件时封闭的，要接受外部数据应该通过props来实现props的作...

受控组件HTML中的表单元素是可输入的，也就是有自己的可变状态而React中可变状态通常保存在state中，并且只能通过setState() 方法来修改React讲state与表单元素值value绑定在一起，有state的值来控制表单元素的值受控组件：值受到react控制的表单元素使用步骤在state中添加一个状态，作为表单元素的value值给表单元素绑定change事件，将...

React组件介绍组件是React的一等公民，使用React就是在用组件组件表示页面中的部分功能组合多个组件实现完整的页面功能特点：可复用、独立、可组合组件的创建方式函数创建组件函数组件：使用JS的函数创建组件约定1: 函数名称必须以大写字母开头约定2: 函数组件必须有返回值，表示该组件的结构(一般为JSX结构，记得小括号包裹)如果返回值为null，表示不渲染任何内容...

使用步骤使用JSX语法创建react元素let h1 = <h1>我是通过JSX创建的元素</h1>使用ReactDOM来渲染元素ReactDOM.render(h1,document.getElementById('root'))为什么在脚手架中可以使用JSX语法JSX 不是标准的ECMAScript语法，它是ECMAScript的语法拓展需要...