ToolbarAndroid 未显示在 React Native 中
ToolbarAndroid is not displaying in react native
我正在学习 react-native
编程,使用这个 https://facebook.github.io/react-native/docs/toolbarandroid.html 创建工具栏,但在我的例子中没有显示。我不明白我到底犯了什么错误。
谁能帮我解决这个问题。
import React, { Component } from 'react';
import { AppRegistry, Text, View, TextInput, TouchableOpacity, ToolbarAndroid } from 'react-native';
import { ToolBar } from 'react-native-material-design';
class LoginComponent extends Component {
render() {
return (
<View style={{flex: 1, flexDirection: 'column', margin:10}}>
<ToolbarAndroid title="Login" titleColor="black"/>
<TextInput style={{height: 40, borderColor:'gray', borderWidth: .5}}
placeholder="Email address" underlineColorAndroid='transparent'/>
<TextInput style={{height: 40, borderColor:'gray', borderWidth: .5}}
placeholder="Password" secureTextEntry={true} underlineColorAndroid='transparent'/>
<TouchableOpacity style={{ height: 40, marginTop: 10 , backgroundColor: '#2E8B57'}}>
<Text style={{color: 'white', textAlign: 'center', marginTop: 10, fontWeight: 'bold'}}>LOG IN</Text>
</TouchableOpacity>
</View>
);
}
}
AppRegistry.registerComponent('Myntra', () => LoginComponent);
这是一个known issue。解决方法是为您的 ToolbarAndroid 设置高度。
我是 react-native 的新手,这是我迄今为止找到的最佳解决方案,希望对您有所帮助。
https://github.com/react-native-community/toolbar-android
首先,
添加 npm install @react-native-community/toolbar-android --save
要么
纱线爱好者添加 yarn add @react-native-community/toolbar-android
二、运行react-native start
命令
三、运行react-native run-android
编码愉快:)
我正在学习 react-native
编程,使用这个 https://facebook.github.io/react-native/docs/toolbarandroid.html 创建工具栏,但在我的例子中没有显示。我不明白我到底犯了什么错误。
谁能帮我解决这个问题。
import React, { Component } from 'react';
import { AppRegistry, Text, View, TextInput, TouchableOpacity, ToolbarAndroid } from 'react-native';
import { ToolBar } from 'react-native-material-design';
class LoginComponent extends Component {
render() {
return (
<View style={{flex: 1, flexDirection: 'column', margin:10}}>
<ToolbarAndroid title="Login" titleColor="black"/>
<TextInput style={{height: 40, borderColor:'gray', borderWidth: .5}}
placeholder="Email address" underlineColorAndroid='transparent'/>
<TextInput style={{height: 40, borderColor:'gray', borderWidth: .5}}
placeholder="Password" secureTextEntry={true} underlineColorAndroid='transparent'/>
<TouchableOpacity style={{ height: 40, marginTop: 10 , backgroundColor: '#2E8B57'}}>
<Text style={{color: 'white', textAlign: 'center', marginTop: 10, fontWeight: 'bold'}}>LOG IN</Text>
</TouchableOpacity>
</View>
);
}
}
AppRegistry.registerComponent('Myntra', () => LoginComponent);
这是一个known issue。解决方法是为您的 ToolbarAndroid 设置高度。
我是 react-native 的新手,这是我迄今为止找到的最佳解决方案,希望对您有所帮助。 https://github.com/react-native-community/toolbar-android
首先,
添加 npm install @react-native-community/toolbar-android --save
要么
纱线爱好者添加 yarn add @react-native-community/toolbar-android
二、运行react-native start
命令
三、运行react-native run-android
编码愉快:)