Javascript 如何在React中获取条件内联样式

我试图添加一个条件内联样式，但它返回此错误

Error: The `style` prop expects a mapping from style properties to values, not a string

代码如下：

<div className="todo" style={todo.isCompleted ? {textDecoration: 'line-through'} : '' }>{todo.text}</div>

{todo.text}

我在网上查了一下，但没有找到任何能帮我解决这个问题的方法。

---

我的语法错了吗？

正确的使用方法

<div className="todo" style={{text-decoration: todo.isCompleted ? 'line-through' : 'none' }}>{todo.text}</div>

{todo.text}

正确的使用方法

<div className="todo" style={{text-decoration: todo.isCompleted ? 'line-through' : 'none' }}>{todo.text}</div>

{todo.text}

嘿，如果要有条件地渲染样式，可以使用如下条件扩展运算符：

<div 
   className="todo"
   {...(todo.isCompleted && {style: {textDecoration: 'line-through'}})}
>
  {todo.text}
</div>

{todo.text}

这样，仅当满足条件时，才能渲染样式道具

---

它抱怨的原因是，三元运算符中的第二个条件是空字符串，react需要一个有效的样式对象。

嘿，如果要有条件地呈现样式，可以使用如下条件扩展运算符：

<div 
   className="todo"
   {...(todo.isCompleted && {style: {textDecoration: 'line-through'}})}
>
  {todo.text}
</div>

{todo.text}

这样，仅当满足条件时，才能渲染样式道具

它抱怨的原因是三元运算符中的第二个条件是空字符串，react需要一个有效的样式对象