SolidJS 中的条件样式

我在 SolidJS 中有一个组件，看起来像这样：

const MyComponent: Component = (params) => {
  // ...
  const [votes, setVotes] = createSignal(new Set());
  const toggle = (val: string) => {
    if (votes().has(val)) {
      let _votes = votes();
      _votes.delete(val);
      setVotes(_votes);
    } else {
      let _votes = votes();
      _votes.add(val);
      setVotes(_votes);
    }
  }

  return <>
    <For each={someArray()}>{(opt, i) =>
      <button 
        style={{
          color: `${ votes().has(opt) ? "blue" : "black"}`
        }} 
        onClick={() => { toggle(opt) } }
      >
        {opt()}
      </button>
    }</For>
  </>
}

我想要发生的是，按钮的样式将根据它是否（opt在 for 循环中）存在于votes set.

但是，这段代码不起作用。投票更新时它不会更新。

votes 变量确实按预期更新。

当我给投票设置初始值时，会显示正确的样式（但之后不会更新）。

有什么解决方案可以使这项工作有效吗？

@Nick 所说的似乎是正确的，尝试改变你的toggle方法：

  const toggle = (val: string) => {
    const _votes = votes();
    _votes.has(val) ? _votes.delete(val) : _votes.add(val);
    setVotes(new Set(_votes));
  }

操场