用圖標替換文本

Question

我使用react-native-popup-menu在單擊文本設置時彈出菜單。這是我的代碼

<View> 
    <Text>Hello world!</Text> 
    <Menu> 
     <MenuTrigger text='Settings' /> 
     <MenuOptions> 
     <MenuOption onSelect={() => alert(`Save`)} text='Save' /> 
     <MenuOption onSelect={() => alert(`Delete`)} > 
      <Text style={{color: 'red'}}>Delete</Text> 
     </MenuOption> 
     <MenuOption onSelect={() => alert(`Not called`)} disabled={true} text='Disabled' /> 
     </MenuOptions> 
    </Menu> 
    </View> 

這工作得很好，但而不是文本「設置」我想從'react-native-elements'顯示圖標。通常我用此代碼顯示圖標

<Icon 
     name='public' 
     color='#5877' 
     onPress={this.handleClick.bind(this)} /> 

如果可以實現此目的，您是否有想法？

Answer 1

MenuTrigger的文檔聲明，如果text道具通過，則不會呈現children。

所以我假設你可以提供任何陣營組件作爲MenuTrigger的孩子，像這樣：

<MenuTrigger> 
    <Icon 
    name='public' 
    color='#5877' 
    /> 
</MenuTrigger> 

退房的MenuTrigger組件的代碼，以及！ https://github.com/instea/react-native-popup-menu/blob/master/src/MenuTrigger.js#L27