2016-05-25 10 views
0

setNativeProps({ text: '' })を使用してテキスト入力をクリアしようとしていますが、これは一般的な方法です - 状態の変化がちらつくため - setNativePropsが呼び出されたときにonChangeが呼び出されないことに気付きました。私にとっては、サイズ変更可能なTextAreaを使用しているため、これは問題です。高さをリセットするにはTextAreaが必要ですが、現在行われているのはonChangeです。React Native - TextInput.setNativePropsがonChangeをトリガーしていません

誰かが私の問題について光を当てることができれば、それは非常に感謝しています。ここで

は私の他のコンポーネントからコンポーネント

import React, { Component } from 'react'; 
import { 
    TextInput, 
} from 'react-native'; 

export default class Input extends Component { 
    constructor() { 
    super(); 
    this.state = { 
     height: 35, 
    }; 
    this.handleChange = this.handleChange.bind(this); 
    } 

    componentWillMount() { 
    const { defaultHeight } = this.props; 

    if (defaultHeight) { 
     this.setState({ 
     height: defaultHeight, 
     }); 
    } 
    } 

    handleChange(event) { 
    console.log(event); 
    if (this.state.height !== event.nativeEvent.contentSize.height) { 
     this.setState({ 
     height: Math.max(this.props.defaultHeight, event.nativeEvent.contentSize.height), 
     }); 
    } 

    if (this.props.onChange) { 
     this.props.onChange(event); 
    } 
    } 

    render() { 
    const { style, ...props } = this.props; 

    return (
     <TextInput 
     ref="input" 
     style={[{ height:this.state.height }, style]} 
     multiline 
     {...props} 
     onChange={this.handleChange} 
     />); 
    } 
} 

Input.propTypes = { 
    style: React.PropTypes.number, 
    onChange: React.PropTypes.func, 
    defaultHeight: React.PropTypes.number, 
}; 

で、私は

this.refs.input.refs.input.setNativeProps({ text: '' });

+0

プラグインを使用していますか?はいの場合はどちらですか?コンポーネントのコードを投稿できますか? –

+0

@AdamTerlson私はちょうどコードを持つ質問を更新しました –

答えて

0

入力をクリアするには、次のことをやっている私はまだのonChangeはまだへの道を発見していません私は解決策を見つけました。

ソリューションはsetNativePropsを呼び出すと、私はその後、this.refs.input.resetInputText();を呼び出し、目的の結果を見ることができた私の他のコンポーネントからの状態

resetInputText() { 
    this.refs.input.setNativeProps({ text: '' }); 
    this.setState({ 
     height: this.props.defaultHeight, 
    }); 
    } 

をリセットする別の関数を作成することでした。

関連する問題