如何在创建-反应-本机-应用-项目创建的本机应用程序中使用世博图标？

Question

我使用了create-react-native-app my-project，但我想使用来自@expo/vector-icons的图标

代码

import { Ionicons} from '@expo/vector-icons';

export default function App(){

 return <Ionicons name={Platform.OS === 'ios'?"ios-happy-outline":"md-happy"} size={100}/>}

实际效果

Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect.

预期结果

图标应该在我的用户界面上可见。

Answer 1

您可以使用来自react-native-vector-icons的https://oblador.github.io/react-native-vector-icons/

• 首先，通过以下方式安装依赖项(react本机-矢量-图标) npm安装反应-本机矢量图标
• 在android/app/src/main中创建资产/字体目录
• 创建字体目录后，将所有字体文件从node_modules/react-native-vector-icons/Fonts复制到其中
• 现在，在App.js中，您可以响应本地矢量图标，如下所示 从“React”导入react；从“react本机”导入{Text，View，StyleSheet，TouchableOpacity}；从‘react本机-矢量-图标/FontAwesome’导入图标图标；// https://icons.expo.fyi用于图标导出默认函数toDoItems({ item，pressHandler}){返回( pressHandler(item.key)}> {item.text} )} const styles= StyleSheet.create({项：{填充: 30，borderColor：‘黑’，borderWidth : 1，borderStyle：‘虚空’，marginVertical : 20，})