Array of Objects with unique IDs

What's the way to go to handle

type Person = {
  id: string;
  firstName: string;
  lastName: string;
}

type workers = { workers: Array<Person> }

type Person = {
  id: string;
  firstName: string;
  lastName: string;
}

type workers = { workers: Array<Person> }

I would like to avoid to iterate over it just using the index (like shown here: https://tanstack.com/form/latest/docs/framework/react/guides/arrays)

What I'd like to have would be something like this:

defaultValue: {
  workers: {
    "5": {
      id: "5",
      firstName: "Bob",
      lastName: "Builder"
    },
    "6": {
      id: "6",
      firstName: "Clark",
      lastName: "Kent"
    }
  }
}

defaultValue: {
  workers: {
    "5": {
      id: "5",
      firstName: "Bob",
      lastName: "Builder"
    },
    "6": {
      id: "6",
      firstName: "Clark",
      lastName: "Kent"
    }
  }
}

So I'd end up with something like this:

const workerId = "5"

<form.Field
  name={`workers[`${workerId}`].firstName`}
  // …
/>

const workerId = "5"

<form.Field
  name={`workers[`${workerId}`].firstName`}
  // …
/>

TanStack•12mo ago•

17 replies

popular-magenta

Array of Objects with unique IDs

What's the way to go to handle

type Person = {
  id: string;
  firstName: string;
  lastName: string;
}

type workers = { workers: Array<Person> }

type Person = {
  id: string;
  firstName: string;
  lastName: string;
}

type workers = { workers: Array<Person> }

defaultValue: {
  workers: {
    "5": {
      id: "5",
      firstName: "Bob",
      lastName: "Builder"
    },
    "6": {
      id: "6",
      firstName: "Clark",
      lastName: "Kent"
    }
  }
}

defaultValue: {
  workers: {
    "5": {
      id: "5",
      firstName: "Bob",
      lastName: "Builder"
    },
    "6": {
      id: "6",
      firstName: "Clark",
      lastName: "Kent"
    }
  }
}

So I'd end up with something like this:

const workerId = "5"

<form.Field
  name={`workers[`${workerId}`].firstName`}
  // …
/>

const workerId = "5"

<form.Field
  name={`workers[`${workerId}`].firstName`}
  // …
/>

Array of Objects with unique IDs

Array of Objects with unique IDs

Similar Threads