Ошибка: тип 'void' нельзя назначить типу 'ReactNode' - PullRequest
Новая
       34

Ошибка: тип 'void' нельзя назначить типу 'ReactNode'

0 голосов
/ 10 апреля 2020

Я пытаюсь получить ошибку при вызове функции, это просто для практики, поэтому я держу все внутри App.tsx . Мой класс выглядит так: 

enum Actor {
  None = '',
}

const initializeCard = () => {
  //some logic here
  return card;
}

export default class App extends Component<{}, State> {
  state: State ={
    card: initializeCard()
  }

  public renderRows = () => {
    const { card } = this.state;
    board.map((actor, index) => this.renderRow(actor, index));
  }

  public renderRow = (actor: Actor, index: number) => {
    return(
      <div className="cell">

      </div>
    )
  }

  public render() {
    return (
      <div className="App">
        <div>
            { this.renderRows() } // Here I'm getting the error
        </div>
      </div>
    )
  }
}

Мой пакет. json выглядит так: 

"dependencies": {
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.3.2",
    "@testing-library/user-event": "^7.1.2",
    "@types/jest": "^24.0.0",
    "@types/node": "^12.0.0",
    "@types/react": "^16.9.0",
    "@types/react-dom": "^16.9.0",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-scripts": "3.4.1",
    "typescript": "~3.7.2"
  }

Полная ошибка выглядит следующим образом:

Тип 'void' не может быть назначен типу 'ReactNode'.ts (2322) index.d.ts (1348, 9): ожидаемый тип происходит из свойства' children ', которое объявлено здесь для типа' DetailHTMLProps , HTMLDivElement> '

Я искал решения для этой ошибки и нашел this , но не смог решить свою проблему с помощью этого решения. Пожалуйста, дайте мне знать, как я могу это исправить. Спасибо.

Ответы [ 2 ]

1 голос
/ 11 апреля 2020

Вам нужно вернуть что-то из вашей функции.

Где функция renderCell? возможно, вы имеете в виду renderRow?

1 голос
/ 11 апреля 2020

Убедитесь, что функция renderRows возвращает отображаемые строки, а не просто отображает их и ничего не делает. 

enum Actor {
  None = '',
}

const initializeCard = () => {
  //some logic here
  return card;
}

export default class App extends Component<{}, State> {
  state: State ={
    card: initializeCard()
  }

  public renderRows = () => {
    const { card } = this.state;
    return board.map((actor, index) => this.renderRow(actor, index));
  }

  public renderRow = (actor: Actor, index: number) => {
    return(
      <div className="cell">

      </div>
    )
  }

  public render() {
    return (
      <div className="App">
        <div>
            { this.renderRows() } // Here I'm getting the error
        </div>
      </div>
    )
  }
}
...