Плоский список становится скрытым, как только состояние изменяется в реакции - PullRequest
Новая
       6

Плоский список становится скрытым, как только состояние изменяется в реакции

1 голос
/ 11 марта 2019

У меня есть представление FlatList с флажком для каждого элемента. Когда я нажимаю флажок, состояние меняется с ложного на истинное в тот момент, когда список скрыт. Кто-нибудь сталкивался с этим странным поведением. 

<FlatList
  data={this.state.branches}
  renderItem={({ item }) => {
    { tempCheckValues[item._id] = false; }
    return (
      <ListItem avatar key={item._id}>
        <Left>
          <CheckBox
            checked={item.checked}
            onPress={this.toggleCheckbox.bind(this, item._id)}
          />
        </Left>
        <Body>
          <Text>{item.branch_name}</Text>
          <Text note>{item.formatted_address}</Text>
        </Body>
      </ListItem>
    );
  }
  }
/>

Флажок переключателя: 

toggleCheckbox = (id) => {
  const changedCheckbox = this.state.branches.find((branch) => branch._id === id);
  console.log('changedCheckbox', changedCheckbox);
  changedCheckbox.checked = !changedCheckbox.checked;
  const checkboxes = Object.assign({}, this.state.checkboxes, changedCheckbox);
  this.setState({ branches: checkboxes });
}

Ответы [ 2 ]

1 голос
/ 11 марта 2019

Вы мутируете государством, может быть причиной проблемы.Лучше было бы клонировать состояние ветвей, обновить клонированные ветви и, наконец, установить SetState.

const clonedBranches = JSON.parse(JSON.stringify(this.state.branches));
const updatedBranch = clonedBranches.find(({_id}) => _id === id)
updatedBranch=!updatedBranches.checked;
this.setState({branches: clonedBranches})
0 голосов
/ 11 марта 2019

внутри toggleCheckbox 

this.setState({ branches: checkboxes });

но вы получаете данные в FlatList с ветвями 

 <FlatList
  data={this.state.branches}

Когда вы вызываете toggleCheckbox, массив ветвей обновляется.Понял?

...