如何將SectionList的scrollToLocation傳遞給子組件？

Question

我正在構建一個React Native應用程序，該應用程序具有用戶需要填寫的流程指南。 當用戶選擇了一個選項時，我想在屏幕上向下滾動到新選項出現的位置。

為此，我需要在按鈕的onClick中可以使用SectionList的scrollToLocation函數。

 42 const sectionData = [
 43   {
 44     data: [
 45       {
 46         key: "1",
 47         program:  [
 48           <Question
 49             key={1}
 50             onAnswerSubmit={() => {
 51               scrollToLocation(1);
       /* 
           How do I access scrollToLocation from 
           SectionList and pass it along as a prop here?
        */
 52             }}
 53           />,
 54           <Question
 55             key={2}
 56             onAnswerSubmit={() => {
 57               scrollToLocation(1);
 58             }}


130   public render() {
131
132     return (
133       <SectionList
135         sections={ sectionData }
136         renderItem={ renderItem }
137         renderSectionHeader={ sectionHeader }
138         keyExtractor={ keyExtractor }
139       >
140       </SectionList>

Question.tsx

 28   public render() {
 29     return (
 30       <Question
 31         {...this.props}
 32         onPress={this.props.onAnswerSubmit}
 33       />
 34     );

Answer 1

您可以像這樣將ref添加到SectionList

ref = "foo"

叫它

this.refs.foo.scrollToLocation(params);

要么

ref = {ref => this.sectionListRef = ref}

叫它

this.sectionListRef.scrollToLocation(params);