如何在React Native中将图标/图像添加到我的选择器项目中?

VK1*_*VK1 4 icons picker react-native

我有一个Picker组件,有两种语言选择:法语和韩语。我想在每个文本组件旁边添加标志的图标/图片。像这样的东西:在此处输入图片说明

我在文档中看不到有关添加图标的任何内容除了安装类似react-native-modal-dropdown之类的东西以外,还有其他方法可以做到这一点吗?我想避免安装任何其他东西。

Vel*_*ely 7

由于我自己正在寻找解决方案,因此我尝试了我在上一条注释中引用的解决方案,但无法使其适用于默认的RN选择器。相反,我发现您可以使用Unicode表情符号(感谢通过评论hippietrail发现这里)。因此,只需从某个位置复制想要的标志表情符号(我使用emojipedia)并将其放在标签prop内即可,这里是一个非常简单的示例

export default class App extends Component {
  state = {
        language: ''
  };

   render() {
     return (
       <View style={styles.container}>
           <Picker
              selectedValue={this.state.language}
              style={{ height: 50, width: 200 }}
              onValueChange={(itemValue, itemIndex) => this.setState({language: itemValue})}>
              <Picker.Item label="  South Korea" value="ko" />
              <Picker.Item label="  France" value="fr" />

          </Picker>
       </View>
     );
   }
 }

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
});
Run Code Online (Sandbox Code Playgroud)

我从emojipedia复制的unicode表情符号在哪里,这就是在Android中的样子(在iOS中看起来类似)