作为基础组件,出于减少通信的设计需要,Input 组件文本框类型时不是受控组件。value 用于设置初始值,开发者仍然可以从 onchange 事件中获取 value 值,当需要强制同步文本框内容时调用 setValue 方法实现。
Input 组件的属性和原生一致。
export default class InputDemo extends PageCore {
onChange = ({value}) => {
if(value === 'abc'){
this.inputEl.setValue('abndefghigklmnopqrstuvwxyz');
}
}
render(){
return (
<Page>
<Input placeholder="请输入abc" onChange={this.onChange} ref={(inputEl)=> { this.inputEl = inputEl}}/>
</Page>
)
}
}
export default class TextareaDemo extends PageCore {
onTextareaChange = ({ value }) => {
if (value === 'abc') {
this.textarea.setValue('这是输入abc后替换的文字');
}
this.setState({
textarea: value
});
}
render(){
return (
<Page>
<Textarea
placeholder="请输入abc"
onChange={this.onTextareaChange}
ref={(inputEl) => { this.textarea = inputEl }
/>
</Page>
)
}
}
说明事项
Textarea
组件与<Input type="text">
方法一致,可参考Input
组件进行控制
参数名 | 类型 | 必选 | 默认值 | 描述 |
---|---|---|---|---|
onChange | function | √ | 无 | onchang事件 |
原生属性 | * | × | 无 |