React Native ViewPagerAndroid錯誤

有沒有人成功使用過ViewPagerAndroid組件？React Native ViewPagerAndroid錯誤

編輯

反應母語0.13.0-RC

我得到的錯誤是： No ViewManager defined for class AndroidViewPager

原帖如下

發生反應 - 原生1.2.0

我不斷收到此錯誤：

Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.

我想他們的代碼exatly作爲UIExplorer例子，ViewPagerAndroidExample.android.js

render: function() { 
    var pages = []; 
    for (var i = 0; i < PAGES; i++) { 
     var pageStyle = { 
     backgroundColor: BGCOLOR[i % BGCOLOR.length], 
     alignItems: 'center', 
     padding: 20, 
     }; 
     pages.push(
     <View key={i} style={pageStyle} collapsable={false}> 
      <Image 
      style={styles.image} 
      source={{uri: IMAGE_URIS[i % BGCOLOR.length]}} 
      /> 
      <LikeCount /> 
     </View> 
    ); 
    } 
    var page = this.state.page; 
    return (
     <View style={styles.container}> 
     <ViewPagerAndroid 
      style={styles.viewPager} 
      initialPage={0} 
      onPageScroll={this.onPageScroll} 
      onPageSelected={this.onPageSelected} 
      ref={viewPager => { this.viewPager = viewPager; }}> 
      {pages} 
     </ViewPagerAndroid> 
     <View style={styles.buttons}> 
      <Button text="Start" enabled={page > 0} onPress={() => this.go(0)}/> 
      <Button text="Prev" enabled={page > 0} onPress={() => this.move(-1)}/> 
      <Text style={styles.buttonText}>Page {page + 1}/{PAGES}</Text> 
      <ProgressBar size={100} progress={this.state.progress}/> 
      <Button text="Next" enabled={page < PAGES - 1} onPress={() => this.move(1)}/> 
      <Button text="Last" enabled={page < PAGES - 1} onPress={() => this.go(PAGES - 1)}/> 
     </View> 
     </View> 
    ); 
    },

來源

2015-10-21 han4wluc

我在0.13.0-rc中碰到了相同的錯誤 - 將依賴項從'compile'反轉爲com.facebook.react：react-native：0.12。+''到'compile'com.facebook.react：react-native： 0.13。''build.gradle'中的''解決了它 – Thomas

我得到了他們的例子。只有測試**上一個**和**下一個** –

我有相同的問題， coudn't修復它。但是，也許你想使用react-native-viewpager，它完美適用於iOS和Android。你可以得到它here：

It's很容易與...在我的Android和iOS應用中的以下工作的人：

1.定義頁/瀏覽次數

var VIEWS = ['View 1','View 2','View 3'];

2.然後設置你的getInitialState功能的數據源：

getInitialState: function() { 
     var dataSource = new ViewPager.DataSource ({ 
      pageHasChanged: (p1, p2) => p1 !== p2, 
     }); 

     return { 
      dataSource: dataSource.cloneWithPages(VIEWS), 
     }; 
    },

3.在您的渲染方法：

 <ViewPager 
     style={this.props.style} 
     dataSource={this.state.dataSource} 
     renderPage={this._renderPage} 
     onChangePage={this._onChangePage} 
     isLoop={true} 
     autoPlay={false}/>

4.然後渲染你的頁面：

 _renderPage: function (data:Object, pageID:number) { 
     return (
      <View style={styles.page}> 
       <Text style={styles.text}>{data + ' pageID: ' + pageID}</Text> 
      </View> 
     ); 
    }, 

    _onChangePage: function (page:number) { 
     notifyMessage ('Current page: ' + page); 
    },

而且，別忘了要求節點模塊：

var ViewPager = require ('react-native-viewpager');

讓我知道如果你發現如何解決ViewPagerAndroid ...

來源

2015-10-21 12:20:50 BigPun86

React Native ViewPagerAndroid錯誤

回答

相關問題