Reagieren — Syntax error: Unexpected token erwartet ;

Für einige Grund, dass ich kann ' T es herausfinden, ich bin immer ein syntax Fehler im folgenden Reagieren Komponente. Der Fehler ist in der ersten curly bracket auf die renderItem(). Was ist falsch?

Vielen Dank im Voraus.

import _ from 'lodash';
import React from 'react';
import { ToDoListHeader } from './todo-list-header';
import { ToDoListItem } from './todo-list-item';

export const ToDoList = (props) => {
  renderItems() {
    return _.map(this.props.todos, (todo, index) => <ToDoListItem key={index} {...todo} />)
  }

  return (
    <div>
      <table>
        <ToDoListHeader />
        <tbody>
          {/* {this.renderItems()} */}
        </tbody>
      </table>
    </div>
  );
}

InformationsquelleAutor Diego Oriani | 2017-07-24

Gut, Sie werden immer Fehler, weil Sie bei der Definition der Funktion wie in einer Klasse, nicht in eine Funktion aus. Verwenden Sie eine korrekte Funktionsdeklaration.

export const ToDoList = (props) => {
  const renderItems = () => {
    return _.map(this.props.todos, (todo, index) => <ToDoListItem key={index} {...todo} />)
  }

  return (
    <div>
      <table>
        <ToDoListHeader />
        <tbody>
          {/* {this.renderItems()} */}
        </tbody>
      </table>
    </div>
  );
}

Es würde funktionieren, wenn nur ToDoList wäre Klasse, wenn.

Danke für die ausführliche Erklärung.

InformationsquelleAutor kind user

  renderItems = () => {
    return _.map(this.props.todos, (todo, index) => <ToDoListItem key={index} {...todo} />)
  }