Getting Error: Expression expected.ts(1109) React js

Question

我正在尝试制作井字游戏，但不幸的是，我在 switch 语句下遇到错误。

1.import React from 'react';
2.import {FaTimes, FaPen, FaRegCircle} from 'react-icons/fa';
3.
4.const Icon = ({name}) =>(
5.  ***switch*** (name) {
6.        case "cirle":
7.            <FaRegCircle className='icons'></FaRegCircle>
            break;
        case "cross":
            <FaTimes className='icons'></FaTimes>
            break;
        default:
            <FaPen className='icons'></FaPen>
            break;
   };
);

export default Icon;

我在第 5 行中收到一个错误，在 switch 关键字下说 Expression expected.ts(1109)。

为什么会出现这个问题，我该如何解决？

Answer 1

您不能将 switch 语句用作表达式。没有函数体的箭头函数期望在粗箭头 =>.

之后的表达式

您需要将函数体包裹在大括号中 {...} 并为每个组件添加 return 关键字，如下所示：

const Icon = ({name}) => {
  switch (name) {
        case "cirle":
            return <FaRegCircle className='icons'></FaRegCircle>
            break;
        case "cross":
            return <FaTimes className='icons'></FaTimes>
            break;
        default:
            return <FaPen className='icons'></FaPen>
            break;
   };
};

Getting Error: Expression expected.ts(1109) React js

Getting Error: Expression expected.ts(1109) React js

expression

reactjs

react-icons