对于react老手来说 这种问题非常容易解决，但是百度上一直没有一个好的解决方案。尤其是最新的reacthook写法资源相当稀少，很多东西都要自己去琢磨 const [InputValue,setInputValue] = useState('') return ( <> // 这里的input用的是ant-design的UI库 所以是大写 但是写法就类似于这一种 <Input value={InputValue} onChange={(event) => { set
initialValue属性支持6（ #RRGGBB ）和8（ #RRGGBBAA ）个数字的十六进制值。
import React from 'react' ;
import InputColor from 'react-input-color' ;
function App ( ) {
const [ color , setColor ] = React . useState ( { } ) ;
return (
< InputCol
在react中通过input的defaultValue绑定的值是可以输入的，但是输入之后，切换绑定的值，通过e.target
可以看到input标签上的value绑定值时发生改变的，但是页面不更新
这里可以使用react中的ref来绑定值
const TemplateNameInput:any=React.createRef()
创建ref（在ts中是需要声明类型的，不然在input中ref会报红）
在input中
<input ref={TemplateNameInput} onBlu
在官方文档中有一个value 和一个defaultValue，在使用defaultValue的时候你会发现，展示默认的值是可以的，但是如果你修改了那个值页面数据是不会更新的。如果你去使用value的时候又会发现他的输入框你输入不了任何值。
解决办法：
<Input key={this.state.name} defaultValue={this.state.name} />
加一个key
在看网上其他解决方案的时候看到可以通过，onChange来得到他event.target.value的
第一次遇到input的defaultValue不会变化，或者只记录前一次的数据，后面的数据不会及时更新，而value是不能改变input的值的
解决办法就是给父级的div或者form添加一个可变的key值 key={String(row.id) +String(Date.now())}
<TextArea key={String(row.id) +String(Date.now())} defaultValue={row.remark} onBlur={this.updat
在项目中，总会遇到对input文本框属性的改变。
disabled 属性规定应该禁用 input 元素，被禁用的 input 元素，不可编辑，不可复制，不可选择，不能接收焦点,后台也不会接收到传值。设置后文字的颜色会变成灰色。disabled 属性无法与 一起使用。
readonly 属性规定输入字段为只读可复制，但是，用户可以使用Tab键切换到该字段，可选择,可以接收焦点，还可以选中或
这个问题的关键其实我们都知道：**state不能通过直接赋值的方式修改，这也是我们为什么要解构出setUserInfo的原因**
到这里你可能很疑惑，我是用的`setUserInfo`呀？
但是看上面传入`setUserInfo`中的函数，传入函数是为了解决需要用到之前的state值的需求，这个`pre`就是之前的 state，可是在这个函数中，却直接使用了`pre.account = e.target.value`这样的形式，**用 = 给一个 state 赋值了！**
既要获取之前的state值，
前言：相信小伙伴在使用react.js的过程中，会碰到这种情况，state的值更新了，input框的value值没有更新。因为我们设置的属性是defaultValue={number}，这种可以实现手动编辑，但是不会随着state值变化而更新，我们将属性更改为value={number}之后，发现又没办法输入了，这个时候需要使用input的onChange方法去更新
1.在代码中使用input框
react input Onchange 事件不能立刻拿到值，只能拿到上次输入的值
<Input className="search-input" value={this.state.searchValue} onChange={this.handleChange}/>
handleChange(e){
this.setState({
searchValue: e.target.value
console.log(this
react具有单向数据流的特点，子组件只能使用父组件所传的值但不能修改。
父组件通过属性向子组件传值，子组件通过方法反过来去调用父组件的数据，最终相当于是父组件自己修改的数据
例：实现一个TodoList的删除item功能
父组件TodoList.js
import React,{Component, Fragment} from 'react';
import TodoItem from './TodoItem';
class TodoList extends Compon
在开发中，比较常见的数据传递方式是通过props属性自上而下（由父到子）进行传递。
但是对于有一些场景：比如一些数据需要在多个组件中进行共享（地区偏好、UI主题、用户登录状态、用户信息等）。
如果我们在顶层的App中定义这些信息，之后一层层传递下去，那么对于一些中间层不需要数据的组件来说，是一种冗余的操作。
import React, { Component } from 'react';
function ProfileHeader(props) {
