0
我需要将道具传递给我的初始状态以编辑窗体(因为我希望窗体的值等于状态),但我无法让它工作。由于它首先加载一个空的道具,所以组件不会将道具给予initialState,我认为是由于createContainer。我尝试了很多东西(componentDidMount,WillMount,WillReceiveProps ...),但没有成功。代码如下,任何想法帮助?反应/流星 - 来自道具的this.state得到undefined
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)
我也试图通过道具为默认值,并保持状态值,但它不允许有两个窗体上。任何想法我能如何解决我的问题? 在此先感谢。
我现在感觉非常惭愧:d非常感谢队友! – Ivo
@Ivo:如果您可以将它标记为答案,那就太好了:) –
当然,完成!再次感谢 – Ivo