首页 > 解决方案 > 错误:第 8 行解析错误意外令牌

问题描述

意外的标记

不知道哪里出错了。我只是跟着书。

import React, { Component } from 'react';
import HelloWorld from './HelloWorld';


class App extends Component 
{
return(
    <div>
        <HelloWorld />
        <HelloWorld />
        <HelloWorld />
    </div>
);
};

我想知道为什么这可能是一个错误。

标签: reactjs

解决方案


使用React.Component,您需要定义一个渲染方法来返回您的 DOM。您可以在React.Component 文档中找到更多详细信息。

class Welcome extends React.Component {
  render() {
    return <h1>Hello, {this.props.name}</h1>;
  }
}

您可能已经将一些示例与新的闪亮语法react hooks混淆了,它现在使用 afunction object而不是 a class object

Hooks 是 React 16.8 中的新增功能。它们让您无需编写类即可使用状态和其他 React 功能。

import React, { useState } from 'react';

function Example() {
  // Declare a new state variable, which we'll call "count"
  const [count, setCount] = useState(0);

  return (
    <div>
      <p>You clicked {count} times</p>
      <button onClick={() => setCount(count + 1)}>
        Click me
      </button>
    </div>
  );
}

推荐阅读