React Native -无法将状态变量传递到样式中

import React, { Component } from 'react';
import { View, StyleSheet } from 'react-native';

class MyComponent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      isRed: true
    };
  }

  render() {
    const { isRed } = this.state;
    const dynamicStyle = isRed ? styles.redBox : styles.blueBox;

    return (
      <View style={dynamicStyle}></View>
    );
  }
}

const styles = StyleSheet.create({
  redBox: {
    backgroundColor: 'red',
    width: 100,
    height: 100
  },
  blueBox: {
    backgroundColor: 'blue',
    width: 100,
    height: 100
  }
});

export default MyComponent;