代码之家  ›  专栏  ›  技术社区  ›  Igor Martins

将道具传递给子组件-React Native

  •  3
  • Igor Martins  · 技术社区  · 7 年前

    我想传递道具 color 给一个偶像的孩子。 这个 <Feather /> 我想补充 颜色 作为道具

    这是我的组件和羽毛孩子

    import { Feather } from '@expo/vector-icons'
    
    export default class CloseButton extends React.PureComponent {
      render () {
        const { style, ...props } = this.props
        return (
          <TouchableOpacity style={styles.close} link {...props} >
            <Feather name='x' size={26} /> // <-- want add color here
          </TouchableOpacity>
        )
      }
    }
    

    这是我的组件,我把道具送进去 ThouchableOpacity

    <Alert.CloseButton onPress={props.onRequestClose} />

    如何传递颜色在这个道具,它只显示在图标上?

    1 回复  |  直到 7 年前
        1
  •  1
  •   Tholle    7 年前

    你可以用一个叫做 color 为了你的 CloseButton 传递给 Feather 组件。

    export default class CloseButton extends React.PureComponent {
      render () {
        const { style, color, ...props } = this.props;
    
        return (
          <TouchableOpacity style={styles.close} link {...props} >
            <Feather name='x' size={26} color={color} />
          </TouchableOpacity>
        )
      }
    }
    

    用法

    <Alert.CloseButton
      onPress={props.onRequestClose}
      color="red"
    />