Как контролировать флажок «проверено» значение с неизвестным количеством флажков

Question

Итак, у меня есть экран, на котором я отображаю неизвестное количество флажков в зависимости от размера списка. Как я могу контролировать «проверенные» значения этих полей?
Я использую response-native-elements для флажков.

Метод визуализации для флажков:

    _showChoices = (list) => {
        return list.map((item, i) => {
            return (
                <CheckBox
                title={item.choice_name}
                checked={}
                size={25}
                onIconPress={() => {}}
                onPress={() => {}}
                key={item.choice_id}
                />
            )
        })
    }

Если вам нужна дополнительная информация, пожалуйста, прокомментируйте.

Спасибо!

Answer 1

Вы можете добавить свойство isChecked к каждому элементу и при нажатии на флажок. Вы можете обновить свойство isChecked.

this.state = {
 list = [
   { choice_id: 12, choice_name:"bluetooth", isChecked: false},
   { choice_id: 23, choice_name:"wifi", isChecked: false},
   { choice_id: 34, choice_name:"hotspot", isChecked: false},
]
 
}

_showChoices = (this.state.list) => {
        return list.map((item, i) => {
            return (
                <CheckBox
                  title={item.choice_name}
                  checked={item.isChecked}
                  size={25}
                  onIconPress={() => {}}
                  onPress={() => {
                    let clonedList = this.state.list.slice();
                    clonedList[i].isChecked = !clonedList[i].isChecked
                    this.setState({list: clonedList})}}
                  }
                  key={item.choice_id}
                />
            )
        })
    }