“如何修复此错误”；“组合传感器”；是只读的。在react-native/react-redux中

我正在使用redux在react native中创建一个新的todo应用程序。 在使用CombineReducer设置rootReducer时，我得到了以下错误

“组合传感器”是只读的

// reducers/todos.js

let nextId = 0;
const todos = (state = [], action) => {
    switch (action.type) {

        case 'ADD_TODO':

            return [
                ...state, {
                    id: nextId++,
                    text: action.text,
                    completed: false,
                }
            ]

        case 'TOGGLE_TODO':
            return state.map(todo =>
                (todo.id === action.id) ? { ...todos, completed: !todo.completed } : todo)

        default:
            return state
    }
}
export default todos;

创建了可见性过滤器以切换todo状态

// reducers/visibilityFilter.js

const visibilityFilter = (state='SHOW_ALL', action) =>{
    return state;
}

export default visibilityFilter;

将两个减缩器合并到索引文件中

// reducers/index.js 

import { combineReducers } from 'redux';

import todos from './todos';
import visibilityFilter from './visibilityFilter';

export default combineReducers = combineReducers({
    todos,
    visibilityFilter
})

这是我的商店档案

import { createStore } from 'redux';

import rootReducer from '../reducers';

export default store = createStore(rootReducer);

---

正如消息明确指出的，不允许您重新分配

组合减速机

。只需将代码更改为以下内容，如中所述：

---

你为什么要这样

export default combineReducers = combineReducers({
    todos,
    visibilityFilter
})

combinereducer（）

的编写方式如下：

import { combineReducers } from "redux";

export default combineReducers({
  todos: () => {
    return {};
  }
});

试着记住一个reducer必须总是返回一个对象、一个字符串或一个数字，这是开始使用reducer的最低要求，以确保你的应用程序不会中断，并且你可以在屏幕上看到一些内容

此外，您不一定需要将您的

combinereducer（）

标识为

rootReducer

，您只需将其组合在一起即可：

import { createStore, compose, applyMiddleware } from "redux";
import thunk from "redux-thunk";
import reducers from "../reducers";

const store = createStore(reducers, {}, compose(applyMiddleware(thunk)));

export default store;

最后，当您创建了

商店

后，您需要将其导入到

App.js

中，并使用

提供者

标记将其连接起来，例如：

import React from "react";
import { StyleSheet, Text, View } from "react-native";
import {
  createBottomTabNavigator,
  createStackNavigator,
  createAppContainer
} from "react-navigation";
import { Provider } from "react-redux";

import store from "./store";

以及：

导出默认类App扩展React.Component{
render（）{
返回(
);
}
}

import React from "react";
import { StyleSheet, Text, View } from "react-native";
import {
  createBottomTabNavigator,
  createStackNavigator,
  createAppContainer
} from "react-navigation";
import { Provider } from "react-redux";

import store from "./store";

export default class App extends React.Component {
  render() {
    return (
      <Provider store={store}>
        <View style={styles.container}>
          <MainNavigator />
        </View>
      </Provider>
    );
  }
}