怎么办React重置刷新组件
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了怎么办React重置刷新组件相关的知识,希望对你有一定的参考价值。
我想重置以刷新输入的状态。我在网上测试了13:this.messageForm.reset()
但我得到的错误并不是一个功能
import React, {Component} from 'react'
import {Form, Button} from 'reactstrap'
export default class Formulaire extends Component {
createMessage = event => {
event.preventDefault()
console.log(this.message.value)
const message = this.message.value
this.props.addMessage(message)
//reset
this.messageForm.reset()
}
render() {
return (
<div>
<Form
className='form'
onSubmit={event =>this.createMessage(event)}
ref={input => this.messageForm = input}
>
<textarea
required
maxLength='140'
ref={input => this.message = input}
>
</textarea>
<Button type="submit"> Envoyer! </Button>
</Form>
</div>
)
}
}
答案
问题是你的<Form>
不是html表单元素,而是reactstrap Form component,因此,它没有.reset()
方法。
Reactstrap允许设置innerRef
prop来访问实际的DOM元素:
<Form
className='form'
onSubmit={event =>this.createMessage(event)}
innerRef={input => this.messageForm = input}
>
以上是关于怎么办React重置刷新组件的主要内容,如果未能解决你的问题,请参考以下文章