How to declare type of an array of a dynamic object as react state?

Question

I need to declare an array of objects, but unlike the other answers on StackOverflow my object is dynamic at runtime.

Example,

Possible [{"id":"1", "random1": "1", "random1": "1", "random1": "1"}]

Possible [{"id":"2", "p": "p2", "p2": "o2"}]

I have data: {}[] but where do I put the any?

const [data, setData] = useState({ data: {}[], isFetching: false });

Or can I define this in a way where I can say there will always be an id: string index but the rest can be any.

Something like this, which is not valid, but perhaps something like this is?

const [data, setData] = useState({ data: { [index: string]: any }[];, isFetching: false });

leonardfactory · Accepted Answer · 2020-05-12 18:32:12Z

1

You can declare an auxiliary type, in order to specify your dynamic structure and keep your code clean:

type Data = {
  data: { [index: string]: any }[];
  isFetching: boolean;
}
// ...
useState<Data>({ data: [], isFetching: false });
// or
useState({ data: [], isFetching: false } as Data);

Given it is React, nothing stops you from having two states (but I suppose you don't like that given your actual code), like:

const [isFetching, setIsFetching] = useState(false);
const [data, setData] = useState([] as ({ [index: string]: any }[]));

answered May 12, 2020 at 18:32

leonardfactory

3,5311 gold badge21 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to declare type of an array of a dynamic object as react state?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related