环境配置 安装脚手架:npm install create-react-app 安装yarn:brew install yarn 创建项目:create-react-app antd-demo 切换路径:cd antd-demo 安装路由:yarn add react-router-dom 安装ax ...            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2021-10-01 09:38:00
                            
                                242阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            npm i antd --save 按需引入import React, { Component } from 'react' import Button from 'antd/lib/button' import 'antd/dist/antd.css' export default class A ...            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2021-08-08 12:13:00
                            
                                152阅读
                            
                                                                                    
                                2评论
                            
                                                 
                 
                
                             
         
            
            
            
            概述React 在 v16.8 提供了 Hook 特性,React Hooks 通过增强函数式组件,为 Function Component 注入一些功能,例如 useState 让原本的 Stateless Function Component 有了状态。工作原理接下来我们从 useState 这个 hook 为切入点,打开 React Hooks 源码看看背后的原理。 先看个 Demo:imp            
                
         
            
            
            
            antd的按需引入+自定主题		1.安装依赖:yarn add react-app-rewired customize-cra babel-plugin-import less less-loader		2.修改package.json				....					"scripts": {            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-02-11 14:26:39
                            
                                392阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            antd的按需引入+自定主题		1.安装依赖:yarn add react-app-rewired customize-cra babel-plugin-import less less-loader		2.修改package.json				....					"scripts": {						"start": "react-app-rewired start",						"build": "react-app-rewired build",						"test": "react-app            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2021-07-16 14:59:31
                            
                                460阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            需求1) 添加任务2) 删除任务3) 更新任务状态4) 全选/全不选5) 清除已完成的任务组件的划分TodoList整体作为一个大组件;Header:input添加List:列表作为一个组件;Item: 列表中的每个列表项(ListItem)作为一个组件Footer:底部展示和功能作为一个组件代码编写App.js 父组件import React, { Component } from 'react            
                
         
            
            
            
            React之Antd组件Modal对话框Modal.method()动态设置确认框和提示框    handleConfirm = (type)=>{        Modal[type]({            title:'确认?',            content:'你            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-01-12 15:26:46
                            
                                702阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            Facebook 官方推出Create-React-App脚手架,基本可以零配置搭建基于webpack的React开发环境,内置了热更新等功能。详细文档可前往链接:Create-React-App文档本文将介绍使用Create-React-App脚手架搭建antd-mobile的开发环境。快速开始: npm install -g create-react-app       /            
                
         
            
            
            
            通过 npm 安装antd和babel-plugin-import。babel-plugin-import是用来按需加载 antd            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-09-29 16:08:20
                            
                                97阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            upload有这么几个需求:上传文件,这个官方文档里最普通案例就有,可以直接使用异步初始化数据(初始化列表是通过接口异步获取的):这个需要使用使用fileList,不能使用defaultFileList下载功能,如果是静态资源,可以有路径了直接下载,但如果是使用参数请求后端接口,需要额外处理,目前一期只用静态资源,这种方式不是很安全,没有做权限管控,对于敏感信息不能这样做校验,官方文档有案例,对后            
                
         
            
            
            
            安装使用antd官网运行yarn add antd引入使用import React, { Component } from 'react'import {Button} from 'antd'	// 引入需要的组件import 'antd/dist/antd.css'	// 引入样式export default class App extends Component {  render() {    return (      <div>        <            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2021-07-09 10:45:30
                            
                                236阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            接触React也有一段时间了,从刚开始jquery式地去使用React,到慢慢走上正轨,还是经过了不少学习的。从开发过程中,遇到的组件大概有两类:UI类、工具类。UI类顾名思义就是能看得到的UI,这些组件一般就是按照需要渲染成相应的样子。工具类是一类虽然看上去好像什么东西都不渲染,但是却需要写在render中作为组件加载才能使用。(无法通过传统对象或者类方法之类实现)作为一个组件,一般来说就是纯粹            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-01-26 09:20:47
                            
                                89阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            一.React中使用antd1.下载antd包   npm i antd -S2.按需引入//App.jsx文件
import {Button} from 'antd' //引入按钮组件
import {WechatOutlined, ShoppingCartOutlined } from '@ant-design/icons'; //icon图标库需要另外引入
import            
                
                    
                        
                                                            
                                                                        
                                                                                        转载
                                                                                    
                            2024-03-16 10:47:47
                            
                                697阅读
                            
                                                                             
                 
                
                                
                     
                                    
                             
         
            
            
            
            直接上代码 const jobColumns = [      {        title: '单位名称',        dataIndex: 'jsdw',        key: 'jsdw',       // 解决方案一e={val}>{val.substring...            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2023-01-09 17:18:49
                            
                                540阅读
                            
                                                                             
                 
                
                             
         
            
            
            
            在页面上做一些搜索条件,为了方便我们可以做一个按钮"置空",或者清除,点击这个按钮实现将输入框中的值删除,在以前的html页面中我们很方便通过js来将值制空,但是react组件封装的很严重了,我们没有办法通过js来制空,即使可以实现也是比较麻烦的            
                
                    
                        
                                                            
                                                                        
                                                                                        原创
                                                                                    
                            2022-09-17 02:46:26
                            
                                510阅读