随笔分类 -  React

使用 redux-devtools-extension 查看 Redux 中状态变化
摘要：1.谷歌浏览器中安装 Redux DevTools 2.代码中添加 import { createStore, applyMiddleware } from 'redux'; import { createLogger } from 'redux-logger'; import { composeW 阅读全文
posted @ 2020-05-07 01:01 年少的你如此美丽 阅读(420) 评论(0) 推荐(0)
react的key值的作用
摘要：因为在reactelement中有一个属性是key，该属性默认是为空值，所以一般情况下，只要组件不加上key值，react是不会去校验组件的key，而是直接采用diff算法进行对比，一旦组件加上了key值，react就会在渲染时对该组件的身份进行校验，首先校验新旧组件的key值是不是一致，不一致的话 阅读全文
posted @ 2019-05-29 19:50 年少的你如此美丽 阅读(191) 评论(0) 推荐(0)
React context基本用法
摘要：React context基本用法 React的context就是一个全局变量，可以从根组件跨级别在React的组件中传递。React context的API有两个版本，React16.x之前的是老版本的context，之后的是新版本的context。 1.老版本的context getChildC 阅读全文
posted @ 2019-03-21 15:45 年少的你如此美丽 阅读(941) 评论(0) 推荐(0)
window.getComputedStyle——ref
摘要：componentDidMount() { const LeftHeight = window.getComputedStyle(this.leftDom).height; console.log(LeftHeight); setTimeout(function(){ const LeftHeight = window.getComputedStyle(thi... 阅读全文
posted @ 2018-01-18 14:02 年少的你如此美丽 阅读(277) 评论(0) 推荐(0)
react-hot-loader 的配置【局部刷新】--{create-react-app}
摘要：安装 1.安装create-react-app npm install -g create-react-app 2.创建项目 create-react-app my-app 配置 1.弹出配置文件 npm run eject 2.安装React Hot Loader npm install --sa 阅读全文
posted @ 2018-01-15 19:22 年少的你如此美丽 阅读(2569) 评论(2) 推荐(0)
react css module
摘要：1 <div className={style['content-warp']}></div> 2 3 <div className={style.search}></div> 4 5 <div className={style['content-warp'] +' ' + style.search 阅读全文
posted @ 2017-11-07 10:02 年少的你如此美丽 阅读(238) 评论(0) 推荐(0)
React项目的打包与部署到腾讯云
摘要：腾讯云送了30天的免费试用，于是有了把react项目部署到上面的想法。项目是默认生成的，只是一个页面，但是这个过程中也遇到了不少麻烦与问题。下面来具体梳理下： create-react-app 来自Facebook官方的零配置命令行工具。create-react-app是来自于Facebook出品的 阅读全文
posted @ 2017-10-24 10:26 年少的你如此美丽 阅读(4138) 评论(0) 推荐(0)
React组件生命周期小结
摘要：除了首次render之后调用componentDidMount，其它render结束之后都是调用componentDidUpdate。 componentWillMount、componentDidMount和componentWillUpdate、componentDidUpdate可以对应起来。 阅读全文
posted @ 2017-10-12 10:33 年少的你如此美丽 阅读(203) 评论(0) 推荐(0)
Google解决跨域
摘要：1、添加 --disable-web-security --user-data-dir=D:\tmp 2、在D的根目录新建tmp文件夹 阅读全文
posted @ 2017-09-08 14:36 年少的你如此美丽 阅读(188) 评论(0) 推荐(0)
npm start 修改启动端口的不同方式
摘要：antd的启动配置文件基于package.json文件，配合roadhog使用时，启动配置是： "scripts": { "start": "roadhog server", "build": "roadhog build", "lint": "eslint --ext .js src test", 阅读全文
posted @ 2017-07-24 16:20 年少的你如此美丽 阅读(4007) 评论(0) 推荐(0)
es6 import $ from 'jquery';
摘要：import $ from 'jquery'; 阅读全文
posted @ 2017-07-18 14:31 年少的你如此美丽 阅读(2274) 评论(0) 推荐(0)
webpack基础+webpack配置文件常用配置项介绍+webpack-dev-server
摘要：一.webpack基础 1.在项目中生成package.json：在项目根目录中输入npm init，根据提示输入相应信息。（也可以不生成package.json文件，但是package.json是很有用的，所有建议生成） 2.安装webpaack a.在全局中安装webpack：npm insta 阅读全文
posted @ 2017-06-01 23:35 年少的你如此美丽 阅读(183) 评论(0) 推荐(0)
react 组件基础
摘要：一、 阅读全文
posted @ 2017-06-01 22:35 年少的你如此美丽 阅读(77) 评论(0) 推荐(0)
react-1 react需要的环境配置
摘要：一、nodeJs简介和安装 1、 官网 https://nodejs.org/en/ NPM https://www.npmjs.com/ 2、检查安装成功的命令 node -v npm -v 二、使用npm配置react开发环境 http://reactjs.cn/react/docs/packa 阅读全文
posted @ 2017-05-17 13:00 年少的你如此美丽 阅读(294) 评论(0) 推荐(0)