Автоформа с Meteor React и простой схемой

Есть ли возможность заставить meteor-autoform работать с meteor-collection2-core и реагировать-метеор?

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);

person Joost Döbken    schedule 24.01.2017    source источник


Ответы (2)


Насколько мне известно, Autoform сильно зависит от Blaze, поэтому вы можете либо использовать компоненты автоформы blaze в реакции (см. здесь), или вы можете использовать для этого другую библиотеку. Я использовал это в недавнем проекте: github.com/nicolaslopezj/simple-react-form. Это мощный, но гораздо более практичный, чем волшебный Autoform (вы должны написать свою собственную форму и компоненты поля).

person Julian K    schedule 24.01.2017

Пакет npm Uniforms очень легко работал с Bootstrap.

Дополнение к ./imports/client/NewBooks.js

import AutoForm from 'uniforms-unstyled/AutoForm';
...
<AutoForm
  schema={Books._collection.simpleSchema()}
  onSubmit={doc => console.log(doc)}
/>
person Joost Döbken    schedule 25.01.2017
comment
Привет! В моем случае у меня была моя модель с именем devices, загруженная через createContainer и Meteor.subscribe, поэтому добавляю свойство model, например эта model = {device} преобразовала форму с заполненными данными из модели! <AutoForm schema={Devices._collection.simpleSchema()} onSubmit={doc => console.log(doc)} model={device} /> - person razor7; 03.08.2017
comment
Униформа выглядит многообещающе! - person Shyam; 16.10.2017