2017-11-09 9 views
0

내 앱에서 Response-native-step-indicator가있는 ViewPager를 사용하고 있지만 특정 버튼을 사용하면 페이지를 변경해야합니다. ViewPager에서 페이지를 변경하는 방법 react-native

import ViewPager from 'react-native-viewpager'; 
import StepIndicator from 'react-native-step-indicator'; 

const PAGES = ['Business','Logo','Description']; 

export default class UserSetup extends Component { 
    constructor() { 
    super(); 
    var dataSource = new ViewPager.DataSource({ 
     pageHasChanged: (p1, p2) => p1 !== p2, 
    }); 
    this.state = { 
     dataSource: dataSource.cloneWithPages(PAGES), 
     currentPage:0, 
     token: null, 
     userId: null, 
     name: "", 
     address1: "", 
     address2: "", 
     city: "", 
     country: "", 
     zipcode: "", 
     url: "", 
     phone: "", 
     description: "", 
    } 
    } 
    render() { 
    const { navigate } = this.props.navigation; 
     return (... 
     <View style={styles.stepIndicator}> 
      <StepIndicator customStyles={indicatorStyles} 
      currentPosition={this.state.currentPage} 
      stepCount={3} 
      labels={['Basic info','Logo','Description']} /> 
     </View> 
     <ViewPager dataSource={this.state.dataSource} 
      renderPage={this.renderViewPagerPage} 
      onChangePage={(page) => {this.setState({currentPage:page})}} 
      /> 
     </View> 
    ); 
    } 

그런 다음 첫 페이지에 내가 버튼을 가지고 있고이 버튼을 누를 때 두 번째 페이지로 첫 페이지를 변경해야합니다 : 여기

내 코드의 일부입니다. 어떻게해야합니까?

ref={(viewpager) => {this.viewpager = viewpager}} 

를 그리고이 같은 페이지에 버튼 onPress에에서 설정 :

this.viewpager.goToPage(NumberPage); 

답변

0

은 그냥 ViewPager 옵션이 포함되어야 솔루션을 발견
ref={(viewPager) => {this.viewPager = viewPager}} 

나중에 이벤트 수신기와 통합 할 수 있습니다.

onPress={()=>this.viewPager.setPage([the index])} 
0

사용 참조