内容汇总

本人技术栈是Vue，最近调部门改成用React开发，从头开始踩坑，持续更新中~

11月16日内容汇总

React事件类型

输入框：onChange，onKeyUp
按钮：onClick

React监听回车事件

onKeyup(e) {
    if(e.keyCode === 13) {
        this.handleBtnClick()
    }
}

报错信息

Cannot update during an existing state transition (such as within render)

这个一般是事件处理函数的 this 没有绑定导致的 。

报错信息

Failed prop type: You provided a value prop to a form field without an onChange handler. This will render a read-only field.

受控组件表单必须要绑定 onChange 事件，否则这个表单就是只读，无法修改。

不能修改的前提是 value 被赋了一个常量。如果将空值 null 赋给 value ，还是可以修改的。

受控组件：自身的value值由组件的state托管，这也是 React 官方推荐的。

上面的代码中， value 用来给表单赋值， onChange 事件用于触发事件处理函数修改 state 。在 Vue 中直接就是一个语法糖 v-model 。

非受控组件：value由第三方库或者DOM进行托管。

文件上传是典型的非受控组件。

React修改antd原生样式

在 Vue 中直接修改是不生效的，需要通过样式穿透 >>> 或 ::v-deep 。

在 React 里面，调出控制台找到组件对应的类名，然后在样式文件中直接修改就行。

React修改Antd组件样式的方法