React Component wird nicht aktualisiert, wenn State Requisiten sich ändern

Question

Ich versuche, eine Liste von Aktien als eine Liste von Schaltflächen zu rendern, und ich verwende mapStateToProps und verbinde meine react-Komponente mit dem Redux-Speicher verbinden. Hier ist die Komponente, funktioniert das Rendering

import React, {Component} from 'react'; 
import {connect} from 'react-redux'; 

class StockList extends Component { 
    super(props){ 
     constructor(props); 
     this.renderButton = this.renderButton.bind(this); 
    } 

    renderButton(stock){ 
     return(
      <button key={stock} type='button' className='btn btn-primary stock-btn'> 
       {stock} 
       <span className='glyphicon glyphicon-remove' aria-hidden='true' 
       onClick={() => this.props.onClick(stock)}></span> 
      </button> 
     ) 
    } 

    render() { 
     if(this.props.stocks){ 
      return (
       <div> 
        {this.props.stocks.map(stock => { 
         return this.renderButton(stock); 
        })} 
       </div> 
      ) 
     }else{ 
      return(
       <div>Loading...</div> 
      ) 
     } 
    } 
} 

StockList.propTypes = { 
    onClick: React.PropTypes.func.isRequired 
}; 

const mapStateToProps = (state) => { 
    console.log(state); 
    return { 
     stocks: state.get(['tickers']) 
    } 
} 

export default connect(mapStateToProps, null)(StockList); 

Nur um sicher zu sein, dass mein Zustand aktualisiert wurde, und nicht mutiert, ich redux-Logger-Middleware verwendet zu prüfen, ob der Zustand ändert. Hier ist die Momentaufnahme, dass in der Konsole präsentierte

action @ 22:43:44.408 SET_TICKERS 
core.js:111 prev state Map {size: 0, _root: undefined, __ownerID: undefined, __hash: undefined, __altered: false} 
core.js:115 action Object {type: "SET_TICKERS", state: Object}state: Objecttickers: Array[3]0: "AAPL"1: "TSLA"2: "GOOGL"length: 3__proto__: Array[0]__proto__: Objecttype: "SET_TICKERS"__proto__: Object__defineGetter__: __defineGetter__()__defineSetter__: __defineSetter__()__lookupGetter__: __lookupGetter__()__lookupSetter__: __lookupSetter__()constructor: Object()hasOwnProperty: hasOwnProperty()isPrototypeOf: isPrototypeOf()propertyIsEnumerable: propertyIsEnumerable()toLocaleString: toLocaleString()toString: toString()valueOf: valueOf()get __proto__: __proto__()set __proto__: __proto__() 
core.js:123 next state Map {size: 1, _root: ArrayMapNode, __ownerID: undefined, __hash: undefined, __altered: false} 

Da ich Immutable JS verwenden, und der Zustand aktualisiert, kann ich nicht scheinen, um herauszufinden, warum meine Komponente nicht die richtigen Requisiten zu zeigen, aktualisieren. Es ändert sich nicht von der ursprünglichen undefiniert.

Der nächste Thread ich zu meinem Problem gefunden haben, ist dies Github Link https://github.com/reactjs/redux/issues/585

ich die Lösungen dort ausgecheckt, aber kein Glück.

Answer 1

Okay, es war ein einfacher Syntaxfehler, aber ich lasse ihn hier, nur für den Fall, dass jemand anderes das gleiche Problem hat.

Das einzige, was

ist die Linie ändern muss

const mapStateToProps = (state) => { 
    console.log(state); 
    return { 
     stocks: state.get(['tickers']) //this line needs to change 
    } 
} 

zu

const mapStateToProps = (state) => { 
    console.log(state); 
    return { 
     stocks: state.get('tickers') //remove the brackets denoting array 
    } 
}