2016-09-10 4 views
0

私はListViewコンポーネントに焦点を当てています。ここ
は私のコードReact Native:どのようにListViewに焦点を当てることができますか?

class MyListView extends Component { 
    static propTypes = { 
     navigator: PropTypes.object.isRequired, 
    }; 

    componentDidMount() { 
     this.listView.focus() 
    } 

    render() { 
     return (
      <ListView 
       ref={ref => { this.listView = ref }} 
       contentContainerStyle={styles.listView} 
       dataSource={cloneWithRows(listDataSource)} 
       renderRow={(data) => <MyListViewCell 
        ... 
       />} 
      /> 
     ) 
    } 
} 
export default MyListView 

だが、それはちょうど私が記事の多くを検索した 「this.listView.focusは関数ではありません」が、私は解決策を見つけることができなかったようなエラーが返されます。
アイデア

+1

'ListView'に' focus() 'メソッドがあると思いますか? – gus27

+0

入力要素にのみフォーカスがあります。 – vijayst

答えて

1

componentDidMountは、componentDidMountが呼び出される前にref propが呼び出されたことを保証しません。次へcomponentDidMountコードを変更する必要があります。

componentDidMount() { 
    requestAnimationFrame(()=>{ 
     this.listView.focus() 
    }) 

} 

また、あなたはrequestAnimationFrameの機能を使用することにした場合。 TimerMixin(TimerMixin doc参照)を使用する方が良いでしょう。 TimerMixin docに示唆されているように、react-mixinを使用してES6でMixinを実装してください。

関連する問題