流星反应插入网址到mongodb商店' null'

时间:2016-07-25 22:36:45

标签: mongodb url meteor reactjs null

我使用表单component将数据插入Mongo-Collection。当我在terminal检查存储的信息时,我会成功存储TitleSelect输入的数据,但null网址和{{both的值为file 1}}输入。

以下是处理导入文件夹中的插入方法的代码:

Meteor.methods({

 'posts.insert' : function(post) {

    return Posts.insert({
      createdAt: new Date(),
      title: post.title,
      social: post.social,
      link: this.link,
      file: this.file
    });
  }
});

以下是处理表单提交的组件代码:

import React, { Component } from 'react';

class AddPost extends Component {

  constructor(props) {
    super(props);

    this.state = {error: ''};
  }

  handleSubmit(event) {
    event.preventDefault();

    const title = this.refs.title.value;
    const social = this.refs.social.value;
    const link = this.refs.link.value;
    const file = this.refs.file.value;

    Meteor.call('posts.insert', {title, social, link, file});
  }

  render() {
    return (
        <div className="modal fade" id="myModal" tabIndex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
          <div className="form-outer">
            <form id='add_post' onSubmit={this.handleSubmit.bind(this)}>
                <div className='form-text form-header'>
                  <p><strong>Hey</strong>, master<span className='error'>{this.state.error}</span></p>
                  <p>Lets share something new today?</p>
                </div>
                <input ref="title" type="text" className="form-input" placeholder="What about the title?" />
                <div className='form-text form-header form-header-distance'>
                  <p>Where should I point the way?</p>
                </div>
                <select ref="social" className="form-select">
                  <option>Select</option>
                  <option>Instagram</option>
                  <option>Twitter</option>
                </select>
                <input ref="link" type="url" className="form-input" placeholder="Point the way" />
                <div className='form-text form-header form-header-distance'>
                  <p>And what about the image?</p>
                </div>
                <label className="file form-file">
                  <input ref='file' className='form-input' type="file" id="file" />
                  <span className="file-custom"></span>
                </label>
                <button type="button" className="form-button" data-dismiss="modal">Close</button>
                <button type="sumbit" className="form-button" >Save</button>
            </form>
          </div>
        </div>
    );
  }
}

export default AddPost;
PS:这是问题的主题,但是如果你能指出一些外部资源或者解释是否可以上传/存储新图像,我会非常感激(不是来自公共文件夹的静态)来自本地机器并将它们提供给前端视图?

1 个答案:

答案 0 :(得分:1)

制作如下流星法:

Meteor.methods({
  'posts.insert'(post){
    post.createdAt: new Date();
    Posts.insert(post);
  }
})