Кнопка React Native при нажатии не работает должным образом

Question

У меня странная проблема в моем собственном приложении реакции, у меня есть кнопки счетчика, такие как увеличение и уменьшение количества продукта с использованием приращения, но проблема в том, что когда я нажимаю на кнопку, меняются значения магазина, но компонент Text (Вид) не меняется автоматически, пока я не нажму за пределами кнопки (это странная проблема).

Я пробовал компонент Button с onPress, TouchableOpacity onPress, но все еще та же проблема.

<TouchableOpacity onPress={()=>{this.handleDecQuantity(item)}}>
 <Icon
  family="AntDesign"
  size={16}
  name="minus"
  color="#2B4D8E"
  style={styles.btn}
 />
</TouchableOpacity>
...
<Text size={16}>{item.quantity}</Text>
...
<Button onlyIcon icon="plus" radius={3} shadowless iconFamily="AntDesign" iconSize={20} color="tarnsparent" iconColor="#2B4D8E" style={styles.btn}  onPress={()=>{this.handleIncQuantity(item)}}>+</Button>

Я надеюсь, что проблема ясна, счетчик меняется только когда я нажимаю за пределами кнопки или TouchableOpacity

Answer 1

в хранилище приставок, он возвращает реквизиты для детей, а не переменную состояния. и реквизиты никогда не должны быть изменены в дочернем компоненте. для более подробной информации, вы можете просмотреть эту статью .if, если вы хотите обновить пользовательский интерфейс. Вы можете сделать следующее:

 constructor(props){
     super(props)
     this.state ={
         quantity:0
       }
   }
 //for react-native version >0.6

 getderivedstatefromprops(nextProps,state){

    return {
       quantity:nextProps.item.quantity
     }
}

//for react-native < 0.6
componentwillreceiveprops(nextProps){
    let copyQuantity = nextProps.item.quantity
    this.setState({quantity:copyQuantity})
 }