Signal Arrays do not work with HTML-Elements?
I tried to debug my problem for a while until I realized that this works:
but this does not:
import { useSignal } from "@preact/signals";
export default function Island() {
const activated = useSignal(false);
return (
<button
onClick={() => {
activated.value = !activated.value;
}}
class={activated.value ? "bg-blue-800" : "bg-red-800"}
>
Test
</button>
);
}import { useSignal } from "@preact/signals";
export default function Island() {
const activated = useSignal(false);
return (
<button
onClick={() => {
activated.value = !activated.value;
}}
class={activated.value ? "bg-blue-800" : "bg-red-800"}
>
Test
</button>
);
}but this does not:
import { useSignal } from "@preact/signals";
export default function Island() {
const activated = useSignal([false]);
return (
<button
onClick={() => {
activated.value[0] = !activated.value[0];
}}
class={activated.value[0] ? "bg-blue-800" : "bg-red-800"}
>
Test
</button>
);
}import { useSignal } from "@preact/signals";
export default function Island() {
const activated = useSignal([false]);
return (
<button
onClick={() => {
activated.value[0] = !activated.value[0];
}}
class={activated.value[0] ? "bg-blue-800" : "bg-red-800"}
>
Test
</button>
);
}