Arrays

Hi, Basarat, great work as usual 😉 Already using it in my project. I have one question though about array. How do you specify a field that contains an array of complex objects. In your docs you have two form states, is that necessary?

TL;DR;

So, can a FieldState contain an array of FormStates as its value?

Example:

class A {
  a: number;
  b: string;
}

class B = {
  arr: A[]
}

can I model it like this?

// i like to have all types globally available in order to reduce imports, don't judge ;)
declare global {
  namespace App.Models {
    type AStateFields = {
      a: FieldState<number>;
      b:  FieldState<string>;
    }

    type BStateFields = {
      arr: FieldState<AStateModel[]>;
    }

    type AState = AStateModel;
    type BState = BStateModel;
  }
}

class AStateModel extends FormState<App.Models.AStateFields> {
  constructor(a: A) {
    super({
      a: new FieldState(a.a),
      b: new FieldState(a.b),
    })
  }
}

class BStateModel extends FormState<App.Models.BStateFields> {
  constructor(b: B) {
    super({
      arr: new FieldState(b.map(item => new AStateModel(item)))
    })
  }
}

[tomitrescak]

G’day mate 😃! I saw your tweet and checked out the tutorial and was very happy with it! Thanks for the amazing work you are doing. Your effort is cutting down the development and refactoring time immensely and is just pleasure to work with it.

[basarat]

@tomitrescak So the way we’ve been handling this is by maintaining additional validation rules regarding the overall form state in our State classes.

But to make it easier to just use formstate just pushed a new version 0.10.0 that allows you to add validators to FormState. This works nice with your example. Also you don’t need to make arrays observable since FormState.$ is automatically made observable for you. Simplified your Cars / Features example further and used it as a tutorial here : https://formstate.github.io/demos/#formstate Hope you like it 🌹 ❤️