Изменить значок при выделении с помощью компонента Shoutem ListView React Native - PullRequest
Новая
       13

Изменить значок при выделении с помощью компонента Shoutem ListView React Native

0 голосов
/ 28 января 2020

Я использую компонент ListView Shoutem / UI. У меня есть некоторые элементы, которые я отображаю, они получены из ответа API и выглядят так: 

[
    {
      "id": 1,
      "name": "Sally"
    },
    {
      "id": 2,
      "name": "Bob"
    }
]

Это код моего визуализированного ListView: 

  renderRow(user) {
    return (
      <View>
        <Row>
          <Icon name='user-profile' />
          <Text>{user.name}</Text>
          <Button styleName='right-icon'>
            <Icon name='checkbox-on' />
          </Button>
        </Row>
        <Divider styleName='line' />
      </View>
    )
  }

(.. .) 

          <ListView
            data={users}
            renderRow={this.renderRow}
          />

Как мне поменять имя иконки на 'checkbox-off' и заново отобразить этот список? Я понимаю, что этот ListView является PureComponent, и необходимо добавить несколько реквизитов, чтобы он мог изменяться в зависимости от состояния, - нужна помощь в этом. Кроме того, чтобы сделать мои элементы в списке узнаваемыми, нужно ли добавить к поступающим данным еще одну пару ключ-значение, что-то вроде следующего, чтобы эти элементы можно было переключать по отдельности? 

[
    {
      "id": 1,
      "name": "Sally",
      "icon": "checkbox-off"
    },
    {
      "id": 2,
      "name": "Bob"
      "icon": "checkbox-off"
    }
]
...