【问题标题】:Autoform with Meteor React and Simple-Schema使用 Meteor React 和 Simple-Schema 自动生成
【发布时间】:2017-01-25 16:54:31
【问题描述】:

是否有可能使meteor-autoformmeteor-collection2-corereact-meteor 一起使用?

MWE

最好是我想要这样的东西。

./imports/api/Books.js

import { Mongo } from 'meteor/mongo';
import SimpleSchema from 'simpl-schema';
const Books = new Mongo.Collection("books");
Books.attachSchema(new SimpleSchema({
    title: {
        type: String,
        label: "Title",
        max: 200
    },
        author: {
        type: String,
        label: "Author"
    },
}));
if (Meteor.isServer) {
    Meteor.publish('allBooks', function () {
        return Books.find({}, );
    });
};
export default Books;

./imports/client/NewBooks.js

import React, { Component, PropTypes } from 'react';
import { createContainer } from 'meteor/react-meteor-data';
import { quickForm } from 'meteor-autoform';
import Books from '../api/Books';
class NewBooks extends Component {
  constructor(props) {
    super(props)
    this.state = {}
  }

  render() {
    return (
      <div className="container">
        <quickForm
            collection={Books}
            id="insertBookForm"
            type="insert">
        </quickForm>
      </div>
    )
  }
};
export default createContainer(() => {
  Meteor.subscribe('allBooks');
  return {
    books: Books.find().fetch()
  }
}, NewBooks);

【问题讨论】:

    标签: meteor-autoform meteor-collection2 meteor-react meteor-1.4


    【解决方案1】:

    npm 包 Uniforms 使用 Bootstrap 非常容易。

    ./imports/client/NewBooks.js 的补充

    import AutoForm from 'uniforms-unstyled/AutoForm';
    ...
    <AutoForm
      schema={Books._collection.simpleSchema()}
      onSubmit={doc => console.log(doc)}
    />
    

    【讨论】:

    • 嗨!在我的情况下,我通过 createContainerMeteor.subscribe 加载了名为 devices 的模型,因此添加了 model 属性,例如这个 model={device} 使用来自模型的填充数据转换了表单! &lt;AutoForm schema={Devices._collection.simpleSchema()} onSubmit={doc =&gt; console.log(doc)} model={device} /&gt;
    • 制服看起来很有前途!
    【解决方案2】:

    据我所知,Autoform 严重依赖 Blaze,因此,您可以在 react 中使用 blaze autoform 组件(请参阅here),也可以为此使用不同的库。我在最近的一个项目中使用了它:github.com/nicolaslopezj/simple-react-form。它功能强大,但比神奇的 Autoform 更“动手”(您必须编写自己的表单和字段组件)。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2014-07-21
      • 2015-05-22
      • 2010-09-11
      • 1970-01-01
      • 2016-08-20
      • 1970-01-01
      • 2015-05-10
      相关资源
      最近更新 更多