react-native-scrollable-tab-view 解决兼容问题

peng%

已于 2022-06-23 17:19:01 修改

阅读量742

点赞数

分类专栏： react 文章标签： react native react.js javascript

于 2022-06-23 17:12:40 首次发布

本文链接：https://blog.csdn.net/weixin_41622634/article/details/125430832

版权

react 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

1.框架版本

reac-native	0.66.0
jdk	1.8
react-native-scrollable-tab-view	1.0.0

2. 问题1

 requireNativeComponent: "RNCViewPager" was ton found in the UIManage

解决办法：

yarn add @react-native-community/viewpager
react-native link @react-native-community/viewpager

参考：github

3. 问题2

this.scrollView.getNode is not a function

解决办法：
打开 node_modules 下的 react-native-scrollable-tab-view 下的 index.js，把 this.scrollView.getNode().scrollTo 改为 this.scrollView.scrollTo

// 修改前
 if (Platform.OS === 'ios') {
      const offset = pageNumber * this.state.containerWidth;
      if (this.scrollView) {
        this.scrollView.getNode().scrollTo({x: offset, y: 0, animated: !this.props.scrollWithoutAnimation, });
      }
    } else {
      if (this.scrollView) {
        if (this.props.scrollWithoutAnimation) {
          this.scrollView.getNode().setPageWithoutAnimation(pageNumber);
        } else {
          this.scrollView.getNode().setPage(pageNumber);
        }
      }
    }
// 修改后
   if (Platform.OS === 'ios') {
      const offset = pageNumber * this.state.containerWidth;
      if (this.scrollView) {
        this.scrollView.scrollTo({x: offset, y: 0, animated: !this.props.scrollWithoutAnimation, });
      }
    } else {
      if (this.scrollView) {
        if (this.props.scrollWithoutAnimation) {
          this.scrollView.setPageWithoutAnimation(pageNumber);
        } else {
          this.scrollView.setPage(pageNumber);
        }
      }
    }