React Native Redux -如何更新数组中的项？

React Native Redux是一种用于构建跨平台移动应用的开发框架，它结合了React Native和Redux的优势。在React Native Redux中，更新数组中的项可以通过以下步骤实现：

在Redux的reducer中，定义一个初始状态(initial state)包含数组的项。
创建一个action，用于更新数组中的项。这个action可以是一个简单的JavaScript对象，包含一个type字段和payload字段。
在reducer中，根据action的type字段，使用不可变的方式更新数组中的项。可以使用数组的map方法遍历数组，找到需要更新的项，并返回一个新的数组。
在React Native组件中，使用connect函数将Redux的state和action与组件进行绑定。
在组件中，通过调用绑定的action来触发更新数组中的项的操作。这将会触发Redux的reducer，更新state中的数组。
在组件中，通过props获取更新后的数组，并在UI中展示。

以下是一个示例代码：

在reducer中定义初始状态和更新数组的逻辑：

const initialState = {
  items: ['item1', 'item2', 'item3']
};

const reducer = (state = initialState, action) => {
  switch (action.type) {
    case 'UPDATE_ITEM':
      const updatedItems = state.items.map((item, index) => {
        if (index === action.payload.index) {
          return action.payload.updatedItem;
        }
        return item;
      });
      return { ...state, items: updatedItems };
    default:
      return state;
  }
};

创建一个action用于更新数组中的项：

const updateItem = (index, updatedItem) => {
  return {
    type: 'UPDATE_ITEM',
    payload: {
      index,
      updatedItem
    }
  };
};

在React Native组件中使用connect函数将state和action与组件绑定：

import { connect } from 'react-redux';
import { updateItem } from './actions';

class MyComponent extends React.Component {
  // ...
}

const mapStateToProps = (state) => {
  return {
    items: state.items
  };
};

const mapDispatchToProps = {
  updateItem
};

export default connect(mapStateToProps, mapDispatchToProps)(MyComponent);

在组件中触发更新数组中的项的操作：

class MyComponent extends React.Component {
  handleUpdateItem = () => {
    const { updateItem } = this.props;
    updateItem(1, 'updatedItem');
  }

  render() {
    const { items } = this.props;
    // 在UI中展示更新后的数组
    return (
      <View>
        {items.map((item, index) => (
          <Text key={index}>{item}</Text>
        ))}
        <Button onPress={this.handleUpdateItem} title="Update Item" />
      </View>
    );
  }
}

这样，当点击按钮时，数组中的第二项将会被更新为'updatedItem'，并在UI中展示出来。

腾讯云相关产品和产品介绍链接地址：