我是本地反应的新手,我面临着一个我不知道如何解决的问题。我创建并启动了一个新项目,如下所示:
- 创建反应本机应用程序项目名称
- cd 项目名称
- 纱线添加反应原生elements@beta
- npm 启动
package.json 看起来像这样:
{
"name": "test",
"version": "0.1.0",
"private": true,
"devDependencies": {
"jest-expo": "25.0.0",
"react-native-scripts": "1.11.1",
"react-test-renderer": "16.2.0"
},
"main": "./node_modules/react-native-scripts/build/bin/crna-entry.js",
"scripts": {
"start": "react-native-scripts start",
"eject": "react-native-scripts eject",
"android": "react-native-scripts android",
"ios": "react-native-scripts ios",
"test": "node node_modules/jest/bin/jest.js"
},
"jest": {
"preset": "jest-expo"
},
"dependencies": {
"expo": "^25.0.0",
"react": "16.2.0",
"react-native": "0.52.0",
"react-native-elements": "^1.0.0-beta3"
}
}
然后我想插入一个带有以下图标的按钮:
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { Button } from 'react-native-elements';
export default class App extends React.Component {
render() {
return (
<View style={styles.container}>
<Text>Open up App.js to start working on your app!</Text>
<Text>Changes you make will automatically reload.</Text>
<Text>Shake your phone to open the developer menu.</Text>
<Button
raised
icon={{ name: 'cached' }}
title='BUTTON WITH ICON' />
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
},
});
不幸的是,我收到此错误消息:
苹果手机上的错误消息
有没有人提示我如何使图标工作?我已经尝试使用"yarn add react-native-vector-icons"添加矢量图标,尽管我确实有一个创建-反应原生项目,但这也没有用。
谢谢!
应该是这样的:
import { Button } from 'react-native-elements';
import Icon from 'react-native-vector-icons/FontAwesome';
...
<Button
icon={
<Icon
name='arrow-right'
size={15}
color='white'
/>
}
title='BUTTON WITH ICON'
/>