reagieren: Anfangszustand Wert ist undefined

Question

Ich versuche, einen Anfangswert zu meinen Zuständen festzulegen. Ich habe constructor verwendet, um einige Werte zu meinem Status zu füllen.

import React,{Component} from 'react'; 

export default class RandomWords extends Component{ 
    constructor(props){ 
    super(props); 
    const str="Italy quake: Norcia tremor destroys ancient buildings"; 
    const words = str.split(" "); 
    this.state= { 
     activeWord:0, 
     activeLetter:0, 
     words:words 
    }; 
    } 
     render(){ 
     console.log("words are:"+this.props.words); 
      return(<div> 
       { this.props.words } 
      </div>) 
     } 
} 

und dann verwendet, i mapStateToPropsstate zu props zu verbinden. Hier ist der Behälter:

import RandomWords from '../components/RandomWords'; 
import {connect} from 'react-redux'; 

function mapStateToProps(state){ 

    return ({words:state.words, 
      activeLetter:state.activeLetter, 
      activeWord:state.activeWord}); 
} 

export default connect(mapStateToProps)(RandomWords); 

Wie Sie sehen, in meiner render() Funktion, ich habe console.log("words are:"+this.props.Words); und ich erwarten, dass die gespaltet Wörter zu sehen. Aber in der Konsole gibt es nur undefined

Answer 1

mapStateToProps verwendet wird, um die Redux state von Ihrem Speicher zu der Komponente Requisiten abzubilden.

Sie initialisieren jedoch die component state. Zwei verschiedene Konzepte. Sie können Zugriff auf die Komponente Zustand über this.state:

render(){ 
    console.log("words are:" + this.state.words); 
    return(<div> 
     {this.state.words} 
    </div>) 
    }