如何通过状态参数更改按钮属性 - React-Native

Question

我正在使用原生主题。我想通过状态参数更改按钮主题。在下面的代码中，我想要做的是当按钮被点击时，按钮变成成功按钮样式。

import React, { Component } from 'react';
import {  Platform,  StyleSheet  } from 'react-native';    
import { Button, Text} from 'native-base';

class GameScreen extends Component {
      constructor(props) {
        super(props);
        this.state = {
          answerBtnClr: 'warning'
        }
      }
    changeButton(){
        this.setState({answerBtnClr: 'success'});
    }
 render() {
    return (
     <Button {this.state.answerBtnClr} onPress={() => this.changeButton()}>
       <Text> Change Me </Text>
     </Button>
     )
    }
 }

    export default GameScreen;

Answer 1

render() {
    const showSuccess = this.state.answerBtn === 'success';
    return (
        <Button success={showSuccess} warning={!showSuccess} ... >
            ...
        </Button>
    )
}

编辑你的 state 和 setState 有两个不同的变量，但我认为它们是相同的，这只是一个错字。

如何通过状态参数更改按钮属性 - React-Native

How to change button attribute by state parameter - React-Native

button

react-native

native-base