javascript - 三元上没有未使用的表达式

Question

在这里，我有一个错误说：

期望一个赋值或函数调用，而是看到一个表达式 no-unused-expressions

我希望 onClick 将我的 const handleCompleted 与三元。我认为这只是 {} 或 () 的问题，我做了很多事情，但我总是收到此错误消息。

const Filters = ({ listTask, setListTask, filters, setFilters }) => {
     const [completed, setCompleted] = useState(false);      

     const handleCompleted = () => {
         const newFilters = { ...filters };
         {
          completed
            ? (setCompleted(false),
              (newFilters.status.completed = ""),
              setFilters(newFilters))
            : (setCompleted(true),
              (newFilters.status.completed = "Completed"),
              setFilters(newFilters));
         }
        };

       return(...);
};

标签： javascriptreactjsjsx

Answer 1

我很确定，这与奇怪的三元结构有关。这可能只是 ESLint 中的一个错误。

但是：应该使用三元运算符有条件地为变量赋值。

虽然它可以用作 的替代品if ()，但不应该那样使用。

原因很简单：它不可读并且容易产生难以调试的不良副作用。只是永远不要使用三元组来替代if ().

试试这个。我认为您会发现它更具可读性。

const Filters = ({ listTask, setListTask, filters, setFilters }) => {
  const [completed, setCompleted] = useState(false);
  const handleCompleted = () => {
    const newFilters = { ...filters };
    // this is how you should use ternaries:
    newFilters.status.completed = completed ? '' : 'Completed'
    setCompleted(!completed)
    setFilters(newFilters)
  };

  return(...);
};