gcanti / tcomb-form

Forms library for react
https://gcanti.github.io/tcomb-form
MIT License
1.16k stars 136 forks source link

Question about factories #243

Closed benmonro closed 8 years ago

benmonro commented 8 years ago

Currently if I have options specified for a field using a custom factory, those options are passed into the factory using this.props.options.myOption. I'm wondering why those things are passed in that way rather than just adding them to props directly like this: this.props.myOption...

The reason I ask this is that we have a bunch of different existing components that we want to use in factories and they are already built to support syntax like <MyComponent myOption='blah' /> and we'd like to minimize the amount of refactoring we need to do to support tcomb.

gcanti commented 8 years ago

I'm wondering why those things are passed in that way rather than just adding them to props directly like this: this.props.myOption

Basically in order to have a clean namespace

we'd like to minimize the amount of refactoring we need to do to support tcomb.

What about to simply spread the options?

<MyComponent {...this.props.options} />
benmonro commented 8 years ago

well we were hoping to do it completely using a factory, doing the spread would require using a template right?

benmonro commented 8 years ago

in other words we'd like to do something like this:

options = {
  MyField: {
    factory: MyComponent,
    myOption: 'blah'
  }
}

then inside MyComponent:

  render() {
     <div>{this.props.myOption}</div>
  }

is that possible or do we need to use a template everywhere we need to use this factory?

gcanti commented 8 years ago

In order to define a custom factory you must implement an interface:

https://github.com/gcanti/tcomb-form/blob/master/GUIDE.md#custom-factories

or extend t.form.Component and then you must define at least a getTemplate method:

class MyFactory extends t.form.Component {

  getTemplate() {
    return (locals) => {
      return <MyComponent />;
    };
  }

}
benmonro commented 8 years ago

I don't see that getTemplate() method mentioned in the readme you just posted. Is that something new? Seems weird to have a getTemplate() method AND a render() method in a component, isn't that what a component is for in the first place?

gcanti commented 8 years ago

The section in the README explains how to define a custom factory from scratch.

As a handy shortcut you can extend t.form.Component (as the default tcomb-form factories do) and just implement a getTemplate method.

gcanti commented 8 years ago

You can even extend the default factories, like t.form.Textbox, t.form.Select, etc... if it comes to handy

benmonro commented 8 years ago

I see. well it would be nice if there was an option to have the options passed in as props directly rather than in props.options. This would basically mean existing react components could much more easily be adapted to be used in tcomb. All we'd need to do is just add a validate() method. Otherwise we have to change our components to extend t.form.Component, provide the getTemplate() method or use Object.assign, which isn't ideal.

gcanti commented 8 years ago

You just have to wrap your component, it seems sensible and pretty simple.