React native get View

Question

I have Scroll View as a header and List view as Body.So I have to swipe scroll view pro-grammatically on list swipe.so in my current code i am getting the id of the scroll view where i need the component actually using which i can call, scrollview.scrollTo(); method.

render() {
        return (
            <View style={styles.container}>
                <View style={styles.scrollContainer}>

                    <ScrollView
                                ref={'abc'}
                                directionalLockEnabled={false}
                                horizontal={true}>

                        <View style={styles.scrollItemStyle}>
                        <Image source={shield} style={homescreenstyle.imagestyle}/>
                        </View>
                        <View style={styles.scrollItemStyle}>
                            <Image source={shield} style={homescreenstyle.imagestyle}/>
                        </View>
                        <View style={styles.scrollItemStyle}>
                            <Image source={shield} style={homescreenstyle.imagestyle}/>
                        </View>
                        <View style={styles.scrollItemStyle}>
                            <Image source={shield} style={homescreenstyle.imagestyle}/>
                        </View>
                        <View style={styles.scrollItemStyle}>
                            <Image source={shield} style={homescreenstyle.imagestyle}/>
                        </View>
                        <View style={styles.scrollItemStyle}>
                            <Image source={shield} style={homescreenstyle.imagestyle}/>
                        </View>
                        <View style={styles.scrollItemStyle}>
                            <Image source={shield} style={homescreenstyle.imagestyle}/>
                        </View>

                    </ScrollView>

                </View>
                <View style={styles.listcontainer}>

                    <ListView
                        dataSource={this.state.todaysData}
                        renderRow={this.renderRow}
                        onScroll={this.handleScroll}
                        style={styles.container}
                    />


                </View>

            </View>
        );
    }



    renderRow(rowData){

        return (
            <CustomListRowCards
                title={rowData.title}/>
        );
    }

    handleScroll(event: Object) {
        // var input = this.refs.scrollview;

        customViewNativeID.scrollTo(500, 0, true)

        // alert(event.nativeEvent.contentOffset.y);
    }

//CutomViewNativeId returns the id..But I need the view actually.Actually i am looking for something which works like findViewById() in android.I am an android developer..I am new to React-Native..Please suggest.Thank you in advance

Answer 1

In order to access any view you would normally do something like this:

class MyComponent extends React.Component {
   viewOne = null
   //state = {...}

   useViewOne = () => {       
      this.viewOne.doSomething()
   }       

   render() {
      return (
        <View ref={(viewRef) => this.viewOne = viewRef}>
        </View>
      )
   }
}

Keep in mind that this.viewOne will be null in componentWillMount() and instead you should use it in componentDidMount()