Свойство forEach не существует для типа XXX в Typescript - PullRequest
Новая
       33

Свойство forEach не существует для типа XXX в Typescript

1 голос
/ 12 июля 2020

Я хочу сгенерировать список строк таблицы, используя forEach() в Typescript и React. Я получаю Property 'forEach' does not exist on type при использовании приведенного ниже кода. Кто-нибудь знает, как это исправить? Разве я не могу использовать forEach () для людей, поскольку это массив PersonInterfaces? 

interface PersonList {
  [index: number]: PersonInterface
}

interface PersonInterface {
  name: string, 
  age: number
}

const persons:PersonList = [
  {
    name: 'John',
    age: 25,
  }, {
    name: 'Jill',
    age: 28,
  }
];

export default function Table() {
  return (
    <table>
      {
        persons.forEach(person => {
          return (
            <tr>
              <td>{person.name}</td>
            </tr>
          );
        })
        }
    </table>
  );
}

Ответы [ 3 ]

3 голосов
/ 12 июля 2020

Вы можете сделать что-то вроде этого: - 

interface Person {
  name: string, 
  age: number
}

const persons:Person[] = [
  {
    name: 'John',
    age: 25,
  }, {
    name: 'Jill',
    age: 28,
  }
];

export default function Table() {
  return (
    <table>
      {
        persons.forEach(person => {
          return (
            <tr>
              <td>{person.name}</td>
            </tr>
          );
        })
        }
    </table>
  );
}

Ваша persons переменная не является допустимым объектом массива. Вы установили его тип на PersonList, который, по сути, является типом. Вот почему вы получаете Property 'forEach' doesn't exist on type.

Еще одна вещь: forEach не возвращает новый массив. Используйте здесь map вместо forEach.

1 голос
/ 12 июля 2020

Помимо проблемы с набором текста, я предполагаю, что вы хотите использовать array.map вместо array.forEach . 

import React from 'react'

interface PersonInterface {
  name: string
  age: number
}

const persons: PersonInterface[] = [
  {
    name: 'John',
    age: 25,
  },
  {
    name: 'Jill',
    age: 28,
  },
]

const Table = () => {
  return (
    <table>
      {persons.map(person => (
        <tr>
          <td>{person.name}</td>
        </tr>
      ))}
    </table>
  )
}

export default Table
0 голосов
/ 12 июля 2020

forEach - это метод из JS Class Array, если вы хотите использовать его в настраиваемом классе, он должен наследовать от Array или просто быть одним (persons:Person[]), как предлагает Лакшья .

...