尘生杜若

首先react本身并不像vue一样具有双向数据绑定这个概念，react只是mv，也就是数据层可以影响视图层，那么如果想要用react实现双向数据绑定应该怎么去实现呢？首先定义一个子组件 import React,{Component} from 'react'; //引入react class Todolist extends Component { constructor(p...

话不多说，直接进入正题！先来了解一下react的生命周期函数有哪些：组件将要挂载时触发的函数：componentWillMount组件挂载完成时触发的函数：componentDidMount是否要更新数据时触发的函数：shouldComponentUpdate将要更新数据时触发的函数：componentWillUpdate数据更新完成时触发的函数：componentDidUpdate...

defaultProps：父子组件传值中，如果父组件调用子组件的时候不给子组件传值，则可以在子组件中使用defaultProps定义的默认值，那么这个时候子组件就显示你所设定的默认值假设有一个Header子组件Header.defaultProps={ title:'这是一个默认值' }propsTypes：是验证父组件传值的类型合法性import PropTypes from '...

在使用模块化开发，经常会遇到组件之间的传值问题，这篇说一下react子组件如何向父组件传值，父组件如何获取子组件的数据和方法父组件：import React, { Component } from 'react';import Header from './Header.js' //引入子组件class Home extends Component{ constructor(prop...

一.搭建React开发环境的前期准备1.必须安装node，注意：推荐安装版本号为双数的版本下载地址搜索官网即可。2.使用node自带的npm或者安装yarnyarn下载地址或者使用npm安装yarn：npm install -g yarn二.搭建一个新的React项目1.安装React官方脚手架(create-react-app) 全局下安装一次就可以了命令行工具中输入：npm...

一.组件名称首字母大写、组件类名称首字母大写二.有constructor一定要有super子类必须在constructor方法中调用super方法，否则新建实例时会报错。这是因为子类没有自己的this对象，而是继承父类的this对象，然后对其进行加工。如果不调用super方法，子类就得不到this对象 constructor(props){ //有constructor必须有super...

相信大家在学习和使用react的过程中，稍不注意就会出现this指向错误的问题，这个问题虽然比较好解决，但是还是让人比较头疼，那么下面就说一下解决这个问题的四种写法。一.行间定义事件后面使用bind绑定this run(){ alert("第一种方法！") } <button onClick={this.run.bind(this)}>第一种</b...

在日常开发的过程中，我们经常会使用input输入框，有时会需要使用value绑定数据，针对这一点，react提出了一个概念，分为了约束性组件和非约束性组件。之前正常使用的时候我们只需要这样写： <input value={绑定的数据} type='text'/>在react中这样的写法会出现一个错误，提示你应该使用onChange来监听这个input或者使用defaultVal...

一.通过event对象信息的方式<input onChange={(e)=>this.inputChange(e)}/><button onClick={()=>this.getInputValue} >获取input的值</button>inputChange(e){ alert(e.target.value) this.setStat...