三元运算符：期望一个赋值或函数调用，而是看到一个表达式答案

【问题标题】：Ternary operator: Expected an assignment or function call and instead saw an expression三元运算符：期望一个赋值或函数调用，而是看到一个表达式
【发布时间】：2020-12-21 16:25:20
【问题描述】：

我正在尝试映射一组打字稿接口对象并将其值打印在表格中。我的数组看起来像这样：

export interface data {
                fields?: field[];
            }

export interface field {
                name: string;
                description: string;
                subfields: subfield[];
            }

但我只想打印 field 的 field.name 等于 requiredName

在使用三元运算符定义条件时，我收到以下错误： Expected an assignment or function call and instead saw an expression

在定义条件语句以映射我的对象时，我将不胜感激。我以前也使用过三元运算符，但仅用于在表格单元格中打印值，而不是动态创建一个。

到目前为止，这是我的代码：

           <Table>
            <TableBody>
              <TableRow >
                <TableCell>
                {props.fields.map((it) =>
                  {it.name===requiredName ? (
                    <Table>...</Table>
                  ) : (
                    null
                  )}
                )} 
                </TableCell>
              </TableRow>
            </TableBody>
          </Table>

提前致谢。

【问题讨论】：

你试过在三元前面加上return吗？
你没有返回任何东西，那就是错误
export interface data { fields?: field[]; } 这里的三元语法不是错了吗？ ?
@jarivak 不是三元的typescriptlang.org/docs/handbook/…

标签： reactjs typescript

【解决方案1】：

您的箭头函数中有大括号，因此您的三元运算符作为函数体中的语句执行，但不返回。

这是你目前拥有的：（我刚刚将隐式 return undefined 添加到函数体中。）

<TableCell>
  {props.fields.map((it) => {
    it.name===requiredName ? (<Table>...</Table>) : (null)
    return undefined
    }
  )} 
</TableCell>

因此，map 函数的结果是一个数组，其中只有 undefined 值。

您可能打算这样做（注意缺少的大括号，这会导致箭头函数返回三元的值）：

<TableCell>
  {props.fields.map((it) => 
    it.name===requiredName ? (<Table>...</Table>) : (null)
  )} 
</TableCell>

【讨论】：

【解决方案2】：

您缺少三元运算符前面的 return 语句。

应该是：

return it.name===requiredName ? (
                    <Table>...</Table>
                  ) : (
                    null
                  )

【讨论】：

解决了您的问题吗？