Chris.Chang-CSDN博客

原创 antd select列表内容更新列表不关闭

组件效果如图:这个是在列表中没有的情况下可以通过底部的新建按钮去快速跳转添加右面的刷新按钮是新建完成之后可以直接刷新获取最新的列表项内容。<FormItem label='类型' {...this.formLayout}>{getFieldDecorator('productTypeId', { initialValue: details.productTypeId, rules: [{ required: true, message: '请选择产品类型' }] })( <

2020-08-19 17:01:34 822

原创 antd分页每页多少条中文设置

再引用antd表格的时候经常用到分页，但是设置如上图多少条每页的时候默认是英文的状态，前几天因为用到所以自己摸索了一下如何变成如上图的中文字样。很多文章提到这是antd的国际化设置，没错在引入antd的时候会带有中文语言包。可作如下操作：import React from 'react// 在需要用到的组件文件中引入中文语言包import zhCN from 'antd/es/locale/zh_CN'; // 引入国际化配置import { ConfigProvider,Table } .

2020-06-26 19:25:37 5286

原创 react路由使用(三)

上篇文章我们介绍了路由的跳转，一种是通过标签形式跳转，一种是函数式跳转，本文我们继续讲解react中路由传递参数。1.params传参：import React from "react";import { Switch, Route, Link, Redirect } from "react-router-dom";import "./App.css";import DemoOne f...

2020-03-01 22:51:40 286

原创 react路由使用(二)

上篇文章介绍了路由安装基本使用,今天继续来看路由的跳转。路由的跳转有两种基本方式，一种是通过标签的形式跳转，一种是函数式跳转，这个跟vue是很相似的。1.通过标签的形式跳转：import {Link,NavLink} from 'react-router-dom' // 这边导入进行跳转的标签const Home = () =>{ return( <di...

2020-02-29 21:52:03 160

原创 react路由使用(一)

在我们使用框架进行开发单页面应用的的时候,路由是必不可少的那么在react中怎么使用路由呢,我分多篇来讲解,今天主要是基本的使用。我们知道在vue中使用脚手架创建的项目是可以附带路由的,但是在react中需要我们自行去安装插件。1.安装：命令行输入：npm install react-router-dom --save进行安装2.在入口文件中作如下配置：import {BrowserRo...

2020-02-28 22:01:52 178

原创 react配置代理解决跨域问题

在我们项目开发过程中难免有时候要解决跨域问题，那么在react中怎么通过配置代理来解决跨域问题呢，其实还是很简单的我们来看一下。1.安装插件：命令行工具输入：yarn add http-proxy-middleware2.在src目录中创建一个setupProxy.js的文件并作如下配置：const {createProxyMiddleware} = require('http-proxy...

2020-02-27 20:37:32 868

原创 react配置Ant Design按需加载

antd这个UI库体积较大,在项目中如果我们采取全部引入的方式将会使项目的性能收到大幅降低,手动按需加载的话当然不是我们希望的做法,所以配置自动按需加载还是很有必要的下面来看如何配置。（注：前提是项目已经安装了antd）1.安装相关依赖包：yarn add react-app-rewired customize-cra这里react-app-rewired 不用弹射就可以配置webpac...

2020-02-26 21:43:36 386

原创 redux-thunk 异步中间件的简单使用

前边我们提到了redux的单独使用和结合react-redux的使用方法,那么作为前端的工程师我们很重要的工作就是跟后端的交互,发送网络请求后端接口,拿到数据渲染到页面上从而展示给用户。我们都知道网络请求是异步操作,所以我们在使用redux的时候action中需要用到中间件的处理,否则则会报出错误。然而此类作用的中间件不只一个,今天只介绍redux-thunk,因为它对于新朋友来说还是比较友好...

2020-02-25 21:44:50 215

原创 redux 与 react-redux 的结合使用

上篇文章我们聊到在react中如何简单的使用redux，那么今天我们就来看一下在“干活的时候”我们是怎样运用redux的。相信很多小伙伴不难看出当我们单独去使用redux的时候虽然有章可循,是在所有使用到的组件中我们都要去导入store,那么有没有什么方法可以不这样做呢？答案是有的。我们可以依靠react的context去自己写一个Provider将其包裹在外层文件中,那么被包裹的所有组件在...

2020-02-24 20:39:06 353

原创浅谈React中Redux的工作流程和基本使用

Redux作为经典的状态管理工具为不少前端人士所青睐，但是也是诸多新朋友在学习新框架中一个相对而言较难的点，网上有很多关于Redux的帖子但是都过于笼统本次我将以个人理解浅谈在React JS库中 Redux基本流程和使用我将用一个例子来为大家讲述在React 中我们的 Redux 是怎样一个角色。Redux就像一家餐厅，对于不同的人而言都可以到这家餐厅进行就餐，不管这些人是家人关系、是朋友...

2020-02-22 17:26:00 1945 6

weixin_45741804的博客