不確かなリデューサでキャッチされていないエラーが発生する

Question

状態を設定しようとすると何かが間違っています。私はただ1つのキーと値のペア{view: ''}をその時点のアプリケーション状態として持っています。

{view: {'0': 's','1': 'e','2': 'c','3': 't','4': 'i','5': 'o','6': 'n','7': 's', view: 'sections'} 

、次のエラー：

Uncaught Error: Objects are not valid as a React child (found: object with keys {0, 1, 2, 3, 4, 5, 6, 7, view}). If you meant to render a collection of children, use an array instead.

における現在の減速（Reduxのクロム拡張からコピーされた）各文字によって分割その単語の値の結果として「セクション」を設定しようとし

export default function reducer(state={}, action) { 
    switch (action.type) { 
    case "SET_VIEW": { 
     return {...state, view: action.payload} 
    } 
    } 
    return state 
} 

次減速の作品を、私は、私は、キー/キー指定でき、上記のような状態を設定することができるようにしたい：使用

を

export default function view(state={}, action) { 
    switch (action.type) { 
    case 'SET_VIEW': 
     return action.payload 
    default: 
    return state 
    } 
} 

このコードは、状況が悪いことを理解するのに十分ですか？必要に応じてより多くのコードを共有しています。そして、より良いタイトルを持っていないのは残念ですが、私は問題の主題が何であるか分かりません。

更新

アプリケーションの初期状態：

const store = createStore(rootReducer, {view: 'sections'}) 

コンポーネントコード：

import React, { Component } from 'react' 
import { connect } from 'react-redux' 
import {setView} from '../actions/viewActions'; 

class App extends Component { 
    render() { 
    return (
     <div> 
     <div onClick={() => this.props.setView('settings')}>SETTINGS</div> 
     <div onClick={() => this.props.setView('sections')}>SECTIONS</div> 
     {this.props.view} 
     </div> 
    ) 
    } 
} 

const mapStateToProps = (state) => ({ 
    view: state.view 
}) 
const mapDispatchToProps = dispatch => { 
    return { 
    setView: (value) => { 
     dispatch(setView(value)); 
    } 
    }; 
} 

export default connect(
    mapStateToProps, 
    mapDispatchToProps 
)(App) 

ファイルviewActions.jsでのアクション：

export const setView = (view) => ({ 
    type: 'SET_VIEW', 
    payload: view 
}) 

Answer 1

コードが動作しない理由はまだ分かりません。 demoという簡単なコードを繰り返し作成していますが、うまくいきます。希望、それは役に立つでしょう。