代码之家 › 专栏 › 技术社区 › alfredopacino

如何使用ref connect

react-native

0

alfredopacino · 技术社区 · 7 年前

我试图调用组件内部的方法。更详细地说,这个组件显示一个垂直页面刷卡器,我需要一个按钮“转到下一张幻灯片”。我想用 ref this.refs.verticalViewPager is undefined . 我试着打印 this.refs , 它也没有定义

class App extends Component {
  nextPage() {
        this.refs.verticalViewPager.nextPage()
    }

  render () {
    return (<VerticalViewPager ref="verticalViewPager">
     <View>
      <Text>slide one</Text>
      <Button title={"click to go to the next slide"}  onPress={this.nextPage}  />
    </View>
    <View>
      <Text>slide two</Text>
    </View>
</VerticalViewPager>)
  }
}

https://github.com/gy-chen/react_native_vertical_view_pager

0 回复 | 直到 7 年前

1

0

Matt Aft 7 年前

尝试使用函数而不是字符串,也可能是因为您没有使用箭头函数或绑定nextPage方法:

class App extends Component {
  nextPage = () => {
        this._verticalViewPager.nextPage()
    }

  render () {
    return (<VerticalViewPager ref={component => this._verticalViewPager = component}>
     <View>
      <Text>slide one</Text>
      <Button title={"click to go to the next slide"}  onPress={this.nextPage}  />
    </View>
    <View>
      <Text>slide two</Text>
    </View>
</VerticalViewPager>)
  }
}