android - react native 矢量图标显示为问号

Question

我已经安装了 react-native v0.46 并安装了 NativeBase，但在组件中使用标签后，没有显示图标而是显示问号(Android 且未在 iOS 中测试)。

为了解决这个问题，我做了很多修改，如下所示:

1. rnpm 链接
2. react-native 链接 react-native-vector-icons
3. NativeBase 安装指南:https://nativebase.io/docs/v0.3.0/getting-started
4. https://github.com/oblador/react-native-vector-icons
5. 我的 json 包文件: { "name": "杂志", “版本”:“0.0.1”， “私有(private)”:是的， “脚本”:{ “开始”:“节点 node_modules/react-native/local-cli/cli.js 开始”， “测试”:“笑话” }, “依赖”:{ “ native 基础”:“^2.3.1”， “ react ”:“16.0.0-alpha.12”， “ native react ”:“0.46.4”， “react-native-image-slider”:“^1.1.5” }, “devDependencies”:{ “通天笑话”:“20.0.3”， "babel-preset-react-native": "2.1.0", “开玩笑”:“20.0.4”， “ react 测试渲染器”:“16.0.0-alpha.12” }, “开玩笑”:{ “预设”:“ native react ” } }
6. 以及我使用这些图标的组件:ios-arrow-left & navicon

我正在使用 Windows 10，Node v8.1.4，React-native-CLI v2.0.1

代码:

import React, { Component } from 'react';
import {
  AppRegistry,
} from 'react-native';
import {Container, Header, Title, Button, Icon} from 'native-base';

export default class CityMagazine extends Component {
  render() {
    return (
        <Container>
          <Header>
            <Button transparent>
              <Icon name="ios-arrow-left" />
            </Button>

            <Title>Header</Title>

            <Button transparent>
              <Icon name="navicon"/>
            </Button>
          </Header>
        </Container>
    );
  }
}

AppRegistry.registerComponent('CityMagazine', () => CityMagazine);

Answer 1

矢量图标由许多已知的库组成，因此您可能需要通过设置 Icon 的类型属性来指定您使用的库，如下所示:

<Icon type="EvilIcons" name="navicon"/>