Custom bindings not working with nested fields

[jennasalau]

Im very confused, but if I create a custom binding for a nest field property it never works.

Take the following:

fields: [
        {
          name: "simple",
          label: "Name",
          bindings: "MaterialTextField"
        },
        {
          name: "dependents",
          label: "Dependents",
          bindings: "MaterialTextField"
        },
        {
          name: "dependents[]",
          bindings: "MaterialTextField"
        },
        {
          name: "dependents[].name",
          label: "Name",
          bindings: "MaterialTextField"
        }
      ]

No matter what I do the dependents[].name always uses the "default" binding. Bug?

My custom bindings are working fine for non nested fields.

Please see this sandbox example demonstrating how the nested fields never get the assigned binding "MaterialTextField".

Do you have tests or examples you can point me to?

[jennasalau]

Hello?

If you can please help point me to the suspect code in your library I am willing to fix it as I'm trying to implement it in a commercial project. I am just finding your source code so very confusing since you are supporting so many API's and have no code comments.

[jennasalau]

Okay I figured it out.

For others in a similar situation:

Basically DONT use Unified Properties as its buggy as all hell and will give you two weeks of headaches and daily standups of looking like an idiot saying the problem is in an open source framework to key stake holders.

From the docs

If you need to create complex forms, I suggest to use the Separated Properties method, as it is more flexible and can be easly extended to manage complex nested fields.

https://foxhound87.github.io/mobx-react-form/docs/fields/defining-fields.html

That little gem changed my world. As soon as we switched to Separated Properties everything just started working!!!