标签: react-native-button

React-Native Button样式不起作用

Import_this

import {AppRegistry, Text, View, Button, StyleSheet} from 'react-native';
Run Code Online (Sandbox Code Playgroud)

这是我的React Button代码但风格不起作用Hare ...

<Button
  onPress={this.onPress.bind(this)} 
  title={"Go Back"}
  style={{color: 'red', marginTop: 10, padding: 10}}
/>
Run Code Online (Sandbox Code Playgroud)

我也试过这个代码

<Button 
       containerStyle={{padding:10, height:45, overflow:'hidden', 
       borderRadius:4, backgroundColor: 'white'}}
       style={{fontSize: 20, color: 'green'}} 
       onPress={this.onPress.bind(this)} title={"Go Back"}
      > Press me!
</Button>
Run Code Online (Sandbox Code Playgroud)

更新问题:

我也是这样尝试..

<Button
    onPress={this.onPress.bind(this)}
    title={"Go Back"}
    style={styles.buttonStyle}
>ku ka</Button>
Run Code Online (Sandbox Code Playgroud)

样式

const styles = StyleSheet.create({
    buttonStyle: {
        color: 'red',
        marginTop: 20,
        padding: 20,
        backgroundColor: 'green'
    }
});
Run Code Online (Sandbox Code Playgroud)

但没有输出:我的手机截图: - 我的手机截图: -

jsx reactjs react-native react-native-button

46
推荐指数
6
解决办法
7万
查看次数

图标未显示在反应导航标题按钮中(React Native)

我正在尝试使用react-navigation-header-buttons 库向 headerRight 添加一个图标。但显示的是图标的标题而不是图标。

这是应该显示图标的代码。

import React, { useState, useLayoutEffect } from 'react';
import { View, Text, Button, StyleSheet } from 'react-native'

import { MEALS } from '../data/DummyData';
import { HeaderButtons, Item } from 'react-navigation-header-buttons';
import { HeaderButton } from '../components/CustomHeaderButton';

const MealDetailScreen = props => {
    const mealId = props.route.params.mealId;
    const selectedMeal = MEALS.find(meal => meal.id == mealId);
    const [headerTitle, setHeaderTitle] = useState();

    useLayoutEffect(() => {
        setHeaderTitle(() => selectedMeal === undefined ? props.route.params.title : selectedMeal.title)
        props.navigation.setOptions({
            headerTitle: headerTitle,
            headerRight: …
Run Code Online (Sandbox Code Playgroud)

react-native react-native-button react-navigation

6
推荐指数
1
解决办法
4128
查看次数