如何使用React导航在React Native中基于状态属性更改导航标题按钮样式？

import { createStackNavigator } from 'react-navigation';
import React from 'react';
import { Button } from 'react-native';

class HomeScreen extends React.Component {
  static navigationOptions = ({ navigation }) => {
    const { params = {} } = navigation.state;
    return {
      headerRight: (
        <Button
          title={params.isButtonActive ? 'Active' : 'Inactive'}
          onPress={params.toggleButton}
        />
      ),
    };
  };

  componentDidMount() {
    this.props.navigation.setParams({ toggleButton: this.toggleButton });
  }

  state = {
    isButtonActive: false,
  };

  toggleButton = () => {
    this.setState(prevState => ({
      isButtonActive: !prevState.isButtonActive,
    }));
  };

  render() {
    return (
      // 页面内容
    );
  }
}

const AppNavigator = createStackNavigator({
  Home: {
    screen: HomeScreen,
  },
});

export default AppNavigator;