Список NativeBase не обновляется

Question

Итак, я получил объект, который выглядит так:

[
  {
    title
    data: [
      {
        id
        name
        checked
      } 
    ]
  },
  ... ( * n item)
]

Эти состояния в редукторе, поэтому в магазине. Когда я нажимаю на элемент, я переключаю отмеченное.

Редуктор:

switch(action.type) {
    case TOGGLE_ITEM:
        const { row, column } = action.payload
        let newState = state.slice()
        newState[row].data[column].checked = !newState[row].data[column].checked
        console.warn(`the references are: ${newState == state ? 'same' : 'different'}`)
        return newState

И компонент (Экран подключен к магазину):

<List dataArray={list}
                    renderRow={(item, sectionID, row) =>
                        <View>
                            <ListItem itemDivider>
                                <Text>
                                    {item.title}
                                </Text>
                            </ListItem>
                            <List dataArray={item.data}
                                renderRow={(subitem, sectionID, column) =>
                                    <Item
                                        toggled={subitem.checked}
                                        text={subitem.name}
                                        onPress={()=>toggleItem(row, column)}
                                    />
                                }
                            />
                        </View>
export default connect(
    state=>({
        list: state.list
    }), {
        toggleItem
    }
)(ListScreen)

Когда я что-то переключаю, я вижу, что состояние меняется в хранилище, и я вижу, что ссылка тоже меняется, но список не будет запускать обновление. : /

Answer 1

Вы мутируете своим состоянием. Это против Redux. Вы должны вернуть копию своего штата.

  const newState = state.map((value, index) => {
    if (index != row) {
      return value
    }

    return {
      ...value,
      data: value.data.map((dataValue, dataIndex) => {
        if (dataIndex != column) {
          return dataValue
        }

        return {
          ...dataValue,
          checked: !dataValue.checked
        }
      })
    }
  })

ПРИМЕЧАНИЕ: NativeBase вернет значение индекса "string". Вот почему мы не используем !==. Вы можете преобразовать строку и столбец в целое число через parseInt.