typescript The types do not match in array processing

Question

I use typescript and react.
Loop through ISerch's sampleQuery, dammyQuery, foodQuery, and groupQuery with items.
I get the following error at save[i].query.

tsError

Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'ISearch'.
  No index signature with a parameter of type 'string' was found on type 'ISearch'.

interface ISearch {
  test: string；
  sampleQuery: { id: number; query: string };
  dammyQuery: { id: number; query: string };
  foodQuery: { id: number; query: string };
  groupQuery: { id: number; query: string };
}

const searchText = (save: ISearch) => {
  const items = ['sampleQuery', 'dammyQuery', 'foodQuery', 'groupQuery'];

  let text = '';

  items.map((i) => {
    if (save[i].query != '') {
      text = text.concat(save[i].query + ',');
    }
  });
  return text;
};

Nghiệp · Accepted Answer · 2021-04-20 06:45:10Z

3

just

const items = ['sampleQuery', 'dammyQuery', 'foodQuery', 'groupQuery'] as const;

answered Apr 20, 2021 at 6:45

Nghiệp

4,7782 gold badges26 silver badges28 bronze badges

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

Comments

Michael Hoobler · Accepted Answer · 2021-04-20 06:43:04Z

1

I'm think there's a more elegant way to do this, but here's my solution:

items.map((i) => {
    let key = i as keyof ISearch
    if (save[key].query != '') {
      text = text.concat(save[key].query + ',');
    }
});

Here's a working playgroud example: https://www.typescriptlang.org/play?#code/JYOwLgpgTgZghgYwgAgJIGUJyggFsgbwFgAoZZAZzgFsAHAGwgEUBXaATwC5DlgATbiBbUARtADcyAI5soXSmCigA5sgC+40uT41q7Vh24FeA5ENETps+RUUr1msshgB7F3wNyjJwcLFRJGUMFJRBVDS1kZSgXFlpPeWN+XwsAq2DbUPDHNVJSBBcQW0o4ADcIbgwsHHwAXkJIqjpGBO9k5AAGABp0r2QAciaGZmt+9S7InWo9Vp52gEYeoL7+qZnR8cjXd1mk0wAmJetufu2PDbUJp2jY+OO50wBmI+D+m7iEsdySb7ySfMKxWAkGoFGQ9QA2oMaMNPj1Vrp9KN4Wc4QN3ncOP0ALqOUiMMDISAAD0J9X6-TxJGBEFBADpqHBaAAKZnAbiZFQASnBAD4Gk4CcgANYQdjg3jIOBg0XsFwwNCYbB4RzkYAK5lUcoQ2XYunLcUAQnJ-R5xCc5BJZKJEFJdIKIAQcDAmrKEB1Yr1BuQAGoBl1Tar1KQ1FyqQ6KC5GHT6C5lMyrWHSEA

answered Apr 20, 2021 at 6:43

Michael Hoobler

6225 silver badges14 bronze badges

2 Comments

Michael Hoobler Over a year ago

What error did you get? "In the query" is not very descriptive :)

ryuma Over a year ago

I was not able to Save. It worked! Thank you.

Yu Miao · Accepted Answer · 2021-04-20 07:07:36Z

1

try:

type TItemKey = 'sampleQuery' | 'dammyQuery' | 'foodQuery' | 'groupQuery';
type TSearch = {
  [key in TItemKey]: { id: number; query: string };
} & { test: string }

const searchText = (save: TSearch) => {
  const items: TItemKey[] = ['sampleQuery', 'dammyQuery', 'foodQuery', 'groupQuery'];

  let text = '';

  items.map((i) => {
    if (save[i].query != '') {
      text = text.concat(save[i].query + ',');
    }
  });
  return text;
};

edited Apr 20, 2021 at 7:07

answered Apr 20, 2021 at 6:58

Yu Miao

5722 silver badges12 bronze badges

Collectives™ on Stack Overflow

typescript The types do not match in array processing

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related