React无状态组件更新props时会失去焦点

React无状态组件更新props时会失去焦点

当input,和Textarea为状态组件时,上级props变更会导致组件完全更新!

完全更新是好事,但是正在输入的texteara会把焦点指到最后!

所有代码就不贴了,有时间贴上代码

下列无状态组件TexArea在输入时焦点会移动

export  default  class TextArea extends React.Component{
render=()=> {
return <textarea   {...this.props}   />
}
}

解决方式:强制引入state状态

export  default  class TextArea extends React.Component{
state={value:this.props.value}
render=()=> {
return <textarea  {...this.props}  value={this.state.value} />
}
}

这问题主要出在Rudex执行dispatch时更新数据时导致props强制更新.