2016-07-19 4 views
0

Я начал использовать Meteor и React Js в своей работе, и я начинаю с ними обоими. Я создаю блог, и мне нужно обновлять сообщения, но у меня возникают проблемы при обновлении данных, данные не сохраняются в коллекции. У меня есть следующая коллекция: Сообщения (название, пул, содержание, автор, категория и теги []). Поля, которые мне нужно обновить: title, content, author, category и tags []. До сих пор я пытался решить эту проблему без положительных результатов. Я использую астрономию как схему. Надеюсь, кто-то может дать совет. Вот код:Как обновить данные в Meteor и React?

import ....other imports 
import { Posts } from '../../lib/collections.jsx'; 

class PostManager extends Component { 
constructor(props) { 
    super(props); 
    this.state = { 
    title: props.post.title, 
    content: props.post.content, 
    category: props.post.category, 
    tags: props.post.tags, 
    slug: props.post.slug, 
    author: props.post.author, 
    }; 
this.updatePost = this.updatePost.bind(this); 
} 
updatePost(event) { 
    event.preventDefault(); 
    const post = this.props.post; 
    const title = this.state.title.defaultValue; 
    const slug = this.state.slug.defaultValue; 
    const content = this.state.content.defaultValue; 
    const category = this.state.category.defaultValue; 
    const tags = this.state.tags.defaultValue; 
    const author = this.state.author.defaultValue; 

    post.set({ 
    title, 
    content, 
    category, 
    tags, 
    slug, 
    author, 
}); 
if (post.validate(false)) { 
    const id = post.save(); 
    console.log(id); 
} 
console.log(post.getValidationErrors(false)); 
} 
render() { 
return (
    <div> 
    <h1>MANAGER Post View</h1> 
    <form 
     className="new-resolution" 
     onSubmit={this.updatePost} 
    > 
     <p>Title:</p> 
     <input type="text" ref="title" 
     defaultValue={this.state.title}   
    /> 
     <p>Text:</p> 
     <input type="text" ref="content" 
     defaultValue={this.state.content} /> 
     <p>Category:</p> 
     <input type="text" ref="category" 
      defaultValue={this.state.category} /> 
     <p>Author:</p> 
     <input type="text" ref="author" 
     defaultValue={this.state.author} /> 
     <p>Tags:</p> 
     <input type="text" ref="tags" defaultValue={this.state.tags} /> 
     <button>Update Post</button> 
    </form> 
    </div> 
); 
} 
} 
PostManager.propTypes = { 
ready: PropTypes.bool.isRequired, 
}; 

export default createContainer(() => { 
const slug = FlowRouter.getParam('slug'); 
const handle = Meteor.subscribe('posts'); 
return { 
    ready: handle.ready(), 
    post: Posts.find({ slug }).fetch()[0], 
    }; 
}, PostManager); 

Некоторые из ошибок, которые я получаю: Карта собственности undefind и инвариантно нарушение, попытка обновить PostManager.

+0

Вы используете SimpleSchema или какой-либо другой инструмент? Попытка выяснить, откуда приходит сообщение post.update(). Кроме того, можете ли вы поделиться трассировкой стека? В общем, вы обычно не хотите делать ваши обновления непосредственно в клиентском коде. Я считаю, что официальная рекомендация - использовать «Meteor.methods», поскольку обновления клиентов считаются угрозой безопасности. – CodeChimp

+0

Извините, я изменил его, чтобы установить. Спасибо за внимание! –

+0

Можете ли вы поделиться трассировками стека и сообщениями об ошибках? – CodeChimp

ответ

0

я был в состоянии сделать его работу и обновлять данные, это правильный ответ:

class PostManager extends Component { 
constructor(props) { 
    super(props); 
    console.log(props); 
    this.state = { 
    title: props.post.title, 
    content: props.post.content, 
    category: props.post.category, 
    tags: props.post.tags, 
    slug: props.post.slug, 
    author: props.post.author, 
    }; 
    this.updatePost = this.updatePost.bind(this); 
} 
updatePost(event) { 
    event.preventDefault(); 
    const post = this.props.post; 
    const title = this.refs.title.value.trim(); 
    const slug = this.state.slug; 
    const content = this.refs.content.value.trim(); 
    const category = this.refs.category.value.trim(); 
    const tags = this.state.tags; 
    const author = this.refs.author.value.trim(); 

    post.set({ 
    title, 
    content, 
    category, 
    tags, 
    slug, 
    author, 
    }); 

    if (post.validate(false)) { 
    const id = post.save(); 
    console.log(id); 
    } 
    console.log(post.getValidationErrors(false)); 
} 

handleCheckboxListUpdate(tags) { 
    this.state.tags = tags; 
    this.setState(this.state); 
} 

render() { 
    return (
    <div> 
     <h1>MANAGER Post View</h1> 
     <form 
     className="new-resolution" 
     onSubmit={this.updatePost} 
     > 
     <p>Title:</p> 
     <input 
      ref="title" 
      type="text" 
      defaultValue={this.state.title} 
     /> 
     <p>Text:</p> 
     <input 
      ref="content" 
      type="text" 
      defaultValue={this.state.content} 
     /> 
     <p>Category:</p> 
     <input 
      type="text" 
      ref="category" 
      defaultValue={this.state.category} 
     /> 
     <p>Author:</p> 
     <input 
      ref="author" 
      type="text" 
      defaultValue={this.state.author} 
     /> 
     <p>Tags:</p> 
     <input 
      type="text" 
      ref="tags" 
      defaultValue={this.state.tags} 
     /> 
     <button>Update Post</button> 
     </form> 
    </div> 
    ); 
    } 
    } 
} 
Смежные вопросы