React/Meteor - this.state von Requisiten wird undefined

Question

Ich muss Requisiten in meinen Ausgangszustand für ein Bearbeitungsformular übergeben (wie ich dann den Wert des Formulars gleich dem Zustand sein will), aber ich kann nicht scheinen damit es funktioniert. Die Komponente gibt die Props nicht an den initialState, da es erstmal mit einer leeren Requisite lädt, denke ich aufgrund des createContainer. Ich habe viele Dinge ausprobiert (componentDidMount, WillMount, WillReceiveProps ...), aber es ist mir nicht gelungen, es funktionieren zu lassen. Der Code ist unten, irgendeine Idee zu helfen?

import React from 'react'; 
import PropTypes from 'prop-types'; 
import { Meteor } from 'meteor/meteor'; 
import moment from 'moment'; 
import { createContainer } from 'meteor/react-meteor-data'; 

import { Blogposts } from './../api/blogposts'; 

export class BlogpostEditItem extends React.Component { 

constructor(props){ 
    super(props); 
    this.state = { 
     title: this.props.blogpost.title, 
     body: this.props.blogpost.body 
    } 
} 

handleBodyChange(e) { 
    const body = e.target.value; 
    this.setState({ body }); 
} 

handleTitleChange(e) { 
    const title = e.target.value; 
    this.setState({ title }); 
} 

onSubmit(e) { 
    e.preventDefault(); 
    this.props.call('blogposts.update', this.props.blogpost._id, this.state.title, this.state.body,); 
} 

renderEditForm() { 
    return(
     <div> 
      <input onChange={this.handleTitleChange.bind(this)} value={this.state.title} placeholder="Title" type="text"/> 
      <textarea onChange={this.handleBodyChange.bind(this)} value={this.state.body} placeholder="Body"></textarea> 
      <button onClick={this.onSubmit.bind(this)}>Submit Blogpost</button> 
     </div> 
    ) 
} 

render() { 
    return (
     <div> 
      { this.props.blogpost ? this.renderEditForm() : 'Pas de post' } 
     </div> 
    ); 
} 
} 

export default createContainer(({params}) => { 
    Meteor.subscribe('blogposts'); 

    return { 
     blogpost: Blogposts.findOne(params.id), 
     call: Meteor.call 
    } 
}, BlogpostEditItem) 

Ich habe auch versucht die Requisiten als default passieren und den Staat als Wert zu halten, aber es darf nicht beide auf einem Formular haben. Irgendeine Idee, wie ich mein Problem lösen könnte? Vielen Dank im Voraus.

Answer 1

Sie Komponente props durch props nicht this.props

constructor(props){ 
 
    super(props); 
 
    this.state = { 
 
     title: props.blogpost.title, 
 
     body: props.blogpost.body 
 
    } 
 
}