React Native setState не перерисовывает - PullRequest
1 голос
/ 09 мая 2019

Ожидаемое поведение этого компонента выглядит следующим образом: я нажимаю его, вызывается функция selectedOpacity (), состояние обновляется, и теперь оно отображается с непрозрачностью = 1.

Но по какой-то причине после вызова this.setState он не перерисовывается. Мне нужно снова щелкнуть по этому компоненту, чтобы сделать его заново и применить изменения непрозрачности из состояния.

export default class Category extends Component {

state = {
  opacity: 0.5
}

selectedOpacity() {
  // some stuff
  this.setState({opacity: 1})
}

render() {
 return(
  <TouchableOpacity style={[styles.container, {opacity: this.state.opacity}]} onPress={() => {
    this.selectedOpacity();
  }}>
  </TouchableOpacity>
 )
}

Ответы [ 3 ]

0 голосов
/ 09 мая 2019

Изменить selectedOpacity на функцию стрелки:

selectedOpacity = () => {
  this.setState({opacity: 1})
}

Тогда:

onPress={this.selectedOpacity}

Редактировать : Документация о реагировании гласит, что она экспериментальная, и ее синтаксис называется синтаксис поля открытого класса .

0 голосов
/ 09 мая 2019

Я думаю, что вам не хватает привязки selectedOpacity (), иначе this будет неопределенным в нем AFAIK.

Также лучше перенести присвоение состояния в конструктор ().

constructor(props) {
    super(props);
    this.state = {};
    this.selectedOpacity = this.selectedOpacity.bind(this);
}

Также измените на следующее, потому что создание функции стрелки внутри рендера влияет на производительность .

onPress={this.selectedOpacity}
0 голосов
/ 09 мая 2019

Попробуйте изменить давление до onPress={() => this.selectedOpacity()}

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...