react
关注
分享
扫一扫
蓝胖子（liaocan.top）
只有坚持，勇敢，专注和定力才能收获自己的的一片天空,个人博客网站 https://liaocan.top
展开
-
1.react的认识
react fiber 是react16之后提出的一种组建渲染架构，可以实现组建的异步渲染组建的渲染以render 方法作为分界线 分为两个部分 前一个部分是可以被打断的，可能会让线程去做更加重要的事情所以render之前的生命周期方法可能不是同步的，而且可能多次执行，所以里面最好是纯函数（不依赖外部环境，全局变量等，仅根据函数输入参数来得到结果，多次调用时结果一致），确保多次执行结果都相同，...原创 2019-01-19 17:26:28 · 203 阅读 · 0 评论 -
[前端] React.js绑定this的5种方法
This is already quite flexible in javascript, and putting it in React makes our choice even more confusing. Let’s look at five binding methods for React this.Use React. createClassIf you are usin...原创 2019-03-15 22:58:10 · 446 阅读 · 0 评论 -
react开发中遇到的问题
1.Element type is invalid expected a string (for built-in components) or a classfuElement type is invalid: expected a string (for built-in components) or a class/function (for compos {/* <Rou...原创 2019-01-22 15:27:58 · 3259 阅读 · 0 评论 -
react-router和react-router-dom区别
react-router-v4，我称之为“第四代react-router”，react-router和react-router-dom的区别是什么呢？为什么有时候我们看到如下的写法：写法1:import {Swtich, Route, Router, HashHistory, Link} from 'react-router-dom';写法2:import {Switch, R...原创 2019-01-22 15:28:07 · 2556 阅读 · 0 评论 -
24.redux-thunk的使用
1.github上搜索redux-thunk,他是redux的中间件，作用主要是让dispatch(action) 方法可以传入一个函数，而不一定是action对象准确的来说是传入的函数的返回值 可以是一个方法或者函数 不一定是action对象 只是这个函数能够接收到dispatch 对象return的时候在执行一下 dispatch(aciton) 这个时候就可以是一个对象了相当于在di...原创 2019-01-21 09:23:02 · 477 阅读 · 0 评论 -
23.react中UI组件，容器组件，无状态组件用法和区别
import React, { Component } from 'react'import 'antd/dist/antd.css'import { Input, Button, List } from 'antd'//无状态组件 没有生命周期，本身只是一个函数，效率比UI组建高，只有一个render方法时可以考虑使用无状态组件const TodolistUI = (props)...原创 2019-01-21 09:22:52 · 550 阅读 · 0 评论 -
19.import export 的使用
export 可以导出多个 default 只有一个 ，并且default 的在import的时候不能使用 {} 其他的必须用{} 并且可以重命名 默认导出const store = createStore(reducer);export default storeimport store from './store/store.js' 普通导出export con...原创 2019-01-21 09:21:51 · 624 阅读 · 1 评论 -
11.react组件生命周期函数
生命周期函数：组建在某一个时期会自动被框架调用的函数component 对其他生命周期函数做了实现 唯独没有render()函数 性能优化 shouldComponentUpdate请求放在componentWillMount componentDidMount 里面设置和清除定时器分别在 componentDidMount componentWillUnmountcomp...原创 2019-01-21 09:21:23 · 302 阅读 · 1 评论 -
10.react中ref用法
react 获取真实dom节点的方法 一般不推荐用 只有在实现复杂的业务时 或者动画效果时1.e.target2.ref 的两种写法handleOnChange(e) {// console.log("事件目标对象", e.target.value)// console.log("todolist组建对象",this)// this.setState({// input...原创 2019-01-21 09:21:06 · 509 阅读 · 1 评论 -
8.Props,state,render调用周期
import React from 'react' class Test extends React.Component {// constructor(props) {// super(props)// }//父组件的render 运行一次 子组件也会重新render 一次//props变化导致子组件render运行一次//当组建的state,props改变...原创 2019-01-20 10:06:23 · 142 阅读 · 0 评论 -
7.PropTypes和DefaultProps
1.对父组件传入的属性进行类型校验import PropTypes from 'prop-types'//组建外面TodoItem.propTypes = {//父组件必须传入test:PropTypes.string.isRequired,content : PropTypes.string.isRequired,index: PropTypes.number.isR...原创 2019-01-19 17:35:31 · 163 阅读 · 0 评论 -
5.react编程思维
1.声明式开发，通过数据指定部分渲染，不是传统的模板引擎渲染需要整个模板渲染加载，虚拟DOM 减少直接操作DOM的性能开销，提供页面渲染效率2.可以和其他框架并存只控制id ="root" dom3.组建化开发4.单向数据流，父组件可以向子组件传递数据，但是数据是只读，子组件不能修改，只能使用，这样方便开发排错，如果子组件需要修改父组件的数据可以，可以由父组件将方法当作属性传递给子...原创 2019-01-19 17:33:18 · 224 阅读 · 0 评论 -
4.组建的拆分和通信，ES6代码规范写法
父组件import React, { Component, Fragment } from 'react';import TodoItem from './todoitem';// import React from 'react'// const Component = React.Component// import style from './style.css' ...原创 2019-01-19 17:32:25 · 197 阅读 · 0 评论 -
3.react组件todolist实例
import React, { Component, Fragment } from 'react';// import style from './style.css' // import React from 'react'// const Component = React.Component class Todolist extends Component {c...原创 2019-01-19 17:29:18 · 441 阅读 · 0 评论 -
2.官方脚手架目录介绍
1.node_modules 项目依赖包2.public 公用的 index.html favicon.ico manifest.json (pwa技术相关 可以指定哪些文件可以被缓存)<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta nam原创 2019-01-19 17:28:00 · 274 阅读 · 0 评论 -
巧用gh-pages分支发布自己的静态项目
大家都知道可以通过github pages 发布自己的静态博客，然后通过 username.github.io 可以访问。例如我的博客可以通过 nqmysb.github.io 访问，不过我的已经绑定域名 https://liaocan.top ，所以会直接跳转到域名显示。但是我们通常由很多其他的静态项目需要展示，所以今天我总结一下如何利用gh-pages分支来发布自己的静态项目，然后可...原创 2019-03-23 17:13:18 · 7828 阅读 · 4 评论