상태가 정의되지 않았습니다. (reactJS)

Question

Relex Redux가 포함 된 앱을 작성하고 있습니다.

이 내 감속기입니다 :

import { INCOME_LIST } from '../actionTypes' 

import Immutable from 'immutable' 

const initialUserState = { 
    list: [{ 
        id: 1, 
        label: 'List item 1' 
       }, 
       { 
        id: 2, 
        label: 'List item 2' 
       }] 
} 

const listReducer = function(state = [initialUserState], action) { 
    switch(action.type) { 
    case 'INCOME_LIST': 
     return Object.assign({}, state, { list: action.data }); 

    default: return state; 
    } 

} 

export default listReducer 

이 내 구성 요소입니다 왜을 console.log (this.props.items가) undifined 가져 오기 '정의되지 않은'

import React, { Component, PropTypes } from 'react' 
import { Link, browserHistory } from 'react-router' 
import { connect } from 'react-redux' 
import axios from 'axios' 

class Income extends Component { 
    constructor(props) { 
    super(props) 
    } 
    } 

render() { 
console.log(this.props.items) 
     return (
      <div> 
       test 
      </div> 
     ) 
    } 

} 

const mapStateToProps = function(store) { 
    return { 
    items: state.list 
    }; 
} 

export default connect(mapStateToProps)(Income); 

콘솔이 있다고? 감속기에서 상태를 얻는 올바른 방법은 무엇입니까? 거기에 실수가있을 수 있습니까?

Answer 1

세 가지 내가 볼 수있는,

는 첫째 mapStateToProps 기능 당신이 저장소로 변수를 정의하고 상태로 사용. 이

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

로 변경 또한 생성자 후에는 추가 }는 당신이 render() 기능을 당신에게 console.log()를 배치 오류가 발생하는 이유를 먹으 렴 있습니다.

또한 감속기에서 초기 상태를 정의하는 방식으로 배열을 만듭니다. 당신은 당신에게,

감속기

import { INCOME_LIST } from '../actionTypes' 

import Immutable from 'immutable' 

const initialUserState = { 
    list: [{ 
        id: 1, 
        label: 'List item 1' 
       }, 
       { 
        id: 2, 
        label: 'List item 2' 
       }] 
} 

const listReducer = function(state = initialUserState, action) { 
    switch(action.type) { 
    case 'INCOME_LIST': 
     return Object.assign({}, state, { list: action.data }); 

    default: return state; 
    } 

} 

export default listReducer; 

구성 요소

class Income extends Component { 
    constructor(props) { 
    super(props) 
    } 


render() { 
console.log(this.props.items) 
     return (
      <div> 
       test 
      </div> 
     ) 
    } 

} 

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

export default connect(mapStateToProps)(Income); 

Answer 2

인수의 이름은 store이지만, state이라고합니다. 시도 :

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