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强制更新.