代码有效但给出：预期分配或函数调用答案

【问题标题】：code works but gives: Expected an assignment or function call代码有效但给出：预期分配或函数调用
【发布时间】：2018-09-17 16:40:21
【问题描述】：

为什么这会导致未使用的表达式错误？

<input style={{margin:'25px 50px 0',textAlign:'center'}}
       type='text' placeholder='add ToDo'
onKeyPress={e =>{(e.key ==='Enter' ? this.addTodo(e.target.value):null) }} />

【问题讨论】：

您能否编辑您的帖子以包含错误消息。谢谢。

标签： javascript reactjs

【解决方案1】：

你用 { } 包装你的函数，但没有返回任何值。删除 { } 它应该可以工作，因为箭头函数具有隐式返回值，否则如果要将其包装在 { } 中，则需要使用“return”返回答案。

试试这个：

onKeyPress={e =>(e.key ==='Enter' ? this.addTodo(e.target.value):null) } />

这里有更多信息，请阅读与“函数体”主题相关的部分：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions

【讨论】：

【解决方案2】：

iceveda06 的回答显示了如何解决这个问题，让我解释一下这个 eslint 规则本身：

赋值和函数调用有副作用（不是绝对正确的，例如一个空函数没有副作用，但是在 eslint 的情况下，它并没有去检查那么远被调用函数究竟做了什么），这是我们在编写代码时最终会做的事情，另一方面，表达式本身就是javascript中的有效语句，例如foo ? 1 : 2;，但是大部分（除了赋值和函数调用）没有任何副作用，因此对整个程序没有任何贡献，所以 eslint 认为它们是糟糕的代码。

查看this question 了解如何区分表达式和语句。

【讨论】：