response-native-elements Кнопка backgroundColor не работает
Я новичок в React Native. В моем простом тестовом приложении я хочу попробовать использовать кнопку act-native-elements
Тем не менее, я не могу показать цвет фона моей кнопки.
Я следовал за документацией и попытался добавить кнопку как это:
import React, { Component } from 'react';
import { Text, View } from 'react-native';
import { Button } from 'react-native-elements';
export default class loginForm extends Component {
render() {
return (
<View>
<Button
backgroundColor={'red'}
title='Login'
/>
</View>
)
}
}
И в App.js я импортирую это так:
import React from 'react';
import { StyleSheet, Text, View, TouchableHighlight, TextInput } from 'react-native';
import { createStackNavigator, createBottomTabNavigator, createAppContainer } from 'react-navigation';
import loginForm from './app/src/components/loginForm.js'
const TestStack = createStackNavigator(
{
Login: {screen: loginForm}
}
)
const AppContainer = createAppContainer(TestStack);
export default class App extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<AppContainer/>
);
}
}
Что я делаю неправильно?
Посмотреть реальный результат
1 ответ
Решение
Используйте опору ниже, чтобы сделать фон красным в реагирующем элементе.
buttonStyle={{backgroundColor: 'red'}}
Вы должны отредактировать стиль кнопки в Reaction -native-элементах, используя prop buttonStyle.
Вот рабочий код. Кнопка здесь красная.
export default class App extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<View>
<Button
title='Login'
buttonStyle={{
backgroundColor:'red'
}}
/>
</View>
);
}
}
Вот рабочий код, https://snack.expo.io/BkRgH0_HE
Вы можете найти больше информации о реквизитах элементов в response-native-elements в ссылке ниже, Props of Buttons