Я хочу написать один 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 уже доступен для это с реактивной поддержкой.