Это хороший шаблон, чтобы сделать HO C с большим количеством реквизита стиля? - PullRequest
0 голосов
/ 03 апреля 2020

Я хочу написать один HO C, который я смогу использовать как

export const MyComponent = (props) => <MyView mt5>{props.children}</MyView>

для передачи реквизитов, связанных со стилями, таких как m1, m2, m3 et c.

* MyView, js
import React from 'react'
import { View as RNView, ViewPropTypes, StyleSheet } from 'react-native'
import PropTypes from 'prop-types'

function MyView({ style, ...props }) {
  style = Array.isArray(style) ? style : [style]

  const { m, _m1, _m2, m1, m2, m3, m4, m5, ...rest } = props

  return (
    <RNView
      {...rest}
      style={[
        m && { margin: m },
        _m1 && styles._m1,
        _m2 && styles._m2,
        m1 && styles.m1,
        m2 && styles.m2,
        m3 && styles.m3,
        m4 && styles.m4,
        m5 && styles.m5,

        ...style,
      ]}
    />
  )
}

MyView.propTypes = {
  ...ViewPropTypes,

  _m1: PropTypes.number,
  _m2: PropTypes.number,
  m1: PropTypes.number,
  m2: PropTypes.number,
  m3: PropTypes.number,
  m4: PropTypes.number,
  m5: PropTypes.number,
}

const styles = StyleSheet.create({
  _m1: { margin: 2 },
  _m2: { margin: 4 },
  m1: { margin: 4 },
  m2: { margin: 8 },
  m3: { margin: 12 },
  m3: { margin: 12 },
})

export default View

Вопрос в том, есть ли что-то не так с этим шаблоном, что-то, о чем я должен помнить, или какой-либо способ оптимизации этого подхода, или какой-то узел node_module уже доступен для это с реактивной поддержкой.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...