Как использовать ref внутри компонента ScrollViewRTL без сохранения состояния? - PullRequest
Новая
       39

Как использовать ref внутри компонента ScrollViewRTL без сохранения состояния?

0 голосов
/ 03 марта 2019

На самом деле, я хочу сделать компонент общего назначения ScrollViewRTL для моего react-native проекта.Основной целью, над которой я хочу поработать, является ситуация RTL компонента ScrollView.Но компонент ScrollView с любым свойством не отображает ситуацию RTL, пожалуйста, обратите внимание на следующие коды: 

import React, { memo } from 'react';
import PropTypes from 'prop-types';
import { StyleSheet, ScrollView } from 'react-native';
import { variables } from 'utils/constants/theme';
import { styleJoiner } from 'utils/helpers';

const ScrollViewRTL = ({ children, style, contentContainerStyle, ...rest }) => (
  <ScrollView
    {...rest}
    style={styleJoiner(styles.wrapper, style)}
    horizontal
    showsHorizontalScrollIndicator={false}
    contentContainerStyle={styleJoiner(
      styles.contentContainer,
      contentContainerStyle
    )}
  >
    {children}
  </ScrollView>
);

ScrollViewRTL.propTypes = {
  children: PropTypes.oneOfType([
    PropTypes.element,
    PropTypes.arrayOf(PropTypes.element),
    PropTypes.func
  ]).isRequired,
  style: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
  contentContainerStyle: PropTypes.oneOfType([
    PropTypes.object,
    PropTypes.array
  ])
};

ScrollViewRTL.defaultProps = {
  style: undefined,
  contentContainerStyle: undefined
};

const styles = StyleSheet.create({
  contentContainer: {
    flexDirection: 'row-reverse',
    minWidth: '100%',
    paddingHorizontal: variables.gutter
  },
  wrapper: {
    flexGrow: 0
  }
});

export default memo(ScrollViewRTL);

Но он стоит в начале ситуации с LTR, для приведенного ниже примера я установил 30тексты, которые начинаются с нуля до 29, вы можете видеть, что это в конце RTL, это означает, что это в начале ситуации LTR:

enter image description here

Поэтому я решил прокрутить его до конца ситуации LTR, которая, кажется, находится в начале ситуации RTL, но я не хочу использовать Component или PureComponent только для использования ref, я хочу использовать ref ввышеуказанный компонент без сохранения состояния, Как я могу это сделать?

...