即使道具正在更新，TouchableOpacity组件也不会重新渲染

Question

我有Button组件，其样式取决于组件属性的变化。即使道具正在更改，组件也不会重新渲染。

const AnswerButton = ({clickedAnswerButtonIndex, index, text, type, updateClickedAnswerButtonIndex}) => {
    const getButtonStyle = () => {
        if(type === appConstants.buttonType.multipleChoiceType) {
            return MultipleChoiceAnswerButtonStyle;
        }
        else return BooleanAnswerButtonStyle;
    }
    const getCircleStyle = (index) => {
        console.log('called');
        if(index ===  clickedAnswerButtonIndex ) return ClickedCircle;
        else return Circle;
    }

    const buttonPress = (index) => { updateClickedAnswerButtonIndex({clickedAnswerButtonIndex: index}); }
        return (
            <TouchableOpacity style={ getButtonStyle() }
                              onPress={ () => buttonPress(index) }>
                <Text style={ textStyle }>{ text }</Text>
                <View style={ getCircleStyle() }/>
            </TouchableOpacity>
        );
    }

const Circle = {
    left : 5,
    top: 4.5,
    width: 30,
    height: 30,
    borderRadius: 30/2,
    backgroundColor: '#fff',
}

const ClickedCircle = {
    left : 5,
    top: 4.5,
    width: 30,
    height: 100,
    borderRadius: 30/2,
    backgroundColor: assets.orangeColor,
}

const textStyle = {
    color: '#fff',
    fontSize: assets.fontSizeSmall,
    fontWeight: 'bold',
    alignSelf: 'center',
    textAlign: 'center',
    flex: 1,
}

export default AnswerButton;

在这里我可以看到，当索引属性更改时，将调用'getCircleStyle（）'。但是不会重新呈现。