![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
React
miles-zh
前端小白,请多关照!!!
展开
-
React 学习笔记(十四)—— 图表使用
安装插件:npm run install --s echarts echarts-for-react导入插件import ReactEchartsCore from "echarts-for-react/lib/core";import echarts from "echarts/lib/echarts";// 导入柱形图import "echarts/lib/chart/bar";// 导入提示import "echarts/lib/component/tooltip";// 导入标题i.原创 2020-09-28 09:37:11 · 348 阅读 · 0 评论 -
React 学习笔记(十三)—— 导出和导入Excel 数据
安装XLSX插件:npm run install --save xlsx在使用的组件中导入xlsx,import XLSX from "xlsx";实现导入// typescript语法,使用antd中的上传按钮uploadExcel = (file: any, fileList: any[]): boolean => { let reader = new FileReader(); reader.onload = (e: any) => { let re.原创 2020-09-28 09:24:52 · 998 阅读 · 0 评论 -
React学习笔记(十二)—— 创建项目
运行:npx create-react-app 项目名称运行:cd 项目名称运行:npm start原创 2019-11-13 10:42:45 · 128 阅读 · 0 评论 -
React快速应用的相关组件库
andt组件库,antd 是基于 Ant Design 设计体系的 React UI 组件库,主要用于研发企业级中后台产品。原创 2019-11-13 10:37:11 · 82 阅读 · 0 评论 -
React学习笔记(十 一)—— 生命周期
生命周期的概念每个组件的实例,从创建、到运行、直到销毁,在这个过程中,会发生一系列事件,这些事件叫做组件的生命周期函数React组件的生命周期分为三个阶段组件创建阶段,特点:一辈子只执行一次componentWillMountrendercomponentDidMount组件运行阶段,特点:按需,根据props属性或state状态的改变,有选择性的执行0到多次co...原创 2019-11-13 10:35:52 · 105 阅读 · 0 评论 -
React学习笔记(十)—— 数据交互
使用axios进行ajax请求获取数据运行:npm i axios -S安装axios语法:// 引入axiosimport axios from 'axios';// 使用componentDidMount(){ // class类的组件生命周期函数 axios.get('https://jsonplaceholder.typicode.com/todos')...原创 2019-11-06 09:42:49 · 221 阅读 · 0 评论 -
React学习笔记(九)—— 路由懒加载
使用react-loadable组件运行:npm i react-loadable -S安装react-loadable使用// 导入react-loadable提供的实现懒加载的函数Loadableimport Loadable from 'react-loadable';// 导入加载种显示的组件import Loading from './my-loading-compone...原创 2019-11-06 09:41:55 · 144 阅读 · 0 评论 -
React学习笔记(八)—— React-router
运行安装:npm i react-router-dom -S 安装react-router-dom在index.js项目入口文件中使用// 引入HashRouter组件或者BrowserRouter组件,HashRouter组件生成的地址带#,BrowserRouter组件生成的地址不带#,Router是HashRouter或者BrowserRouter的别名import {HashRo...原创 2019-11-06 09:41:11 · 247 阅读 · 0 评论 -
React学习笔记(七)—— Redux
vv原创 2019-11-06 09:40:11 · 114 阅读 · 0 评论 -
React报错总结
第一种错误:使用redux时,用redux提供的Provider包裹App组件.错误信息:Uncaught Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reas...原创 2019-10-24 20:52:48 · 1761 阅读 · 0 评论 -
React学习笔记(六)—— 使用css样式
在组件内使用样式style样式语法:style={ {color:'red',fontSize:'25px'} } ,如果值是字符串类型的需要用引号包裹,如果是纯数字的可以不用引号包裹外部样式语法1:const userstyle = { header:{color:'red'}, content:{margin:'10px'}}export default function ...原创 2019-10-20 22:18:14 · 182 阅读 · 0 评论 -
React学习笔记(五)—— 事件绑定
1.直接绑定语法:<button onClick={function(){console.log('a')}}>按钮</button>2.语法:export default class BindEvent extends React.Component{ constructor(){ super(); this.state...原创 2019-10-20 15:04:20 · 194 阅读 · 0 评论 -
React学习笔记(四)—— ES6 中class关键字的基本使用
ES6中class关键字是用于实现面向对象编程的新形式function Person(name,age){ this.name=name; this.age=age;}var person=new Person('zhangsan',18)class Person{ // 这是类中的构造器,如果没有手动指定构造器,可以认为类内部有看不见的空构造器 // 构造器的作用就是...原创 2019-10-18 11:09:35 · 335 阅读 · 0 评论 -
React学习笔记(三)—— 中创建组件的方式
第一种方式:在index.js文件中// 组件的名称首字母必须是大写function Hello(){// 必须返回一个合法的虚拟DOM元素或者null return <div>这是一个hello组件</div>}ReactDOM.render( <div> <Hello></Hello></div>...原创 2019-10-18 10:57:25 · 126 阅读 · 0 评论 -
React学习笔记(二)—— jsx语法最基本使用
基本ReactDOM.render(<h3>h3</h3>, document.getElementById('app'))变量let a=10;ReactDOM.render( <h3>{a}</h3>, document.getElementById('app'))变量计算let a=10;ReactDOM.rend...原创 2019-10-17 19:24:47 · 307 阅读 · 0 评论 -
React学习笔记(一)—— 如何使用
运行:npm i react react-dom -S安装react和react-dom在index.js中加入如下代码:// 1.引入import React from 'react'import ReactDOM from 'react-dom'在index.html中增加容器<div id="app"></div> 简单使用,在index....原创 2019-10-17 17:38:40 · 159 阅读 · 0 评论