面试题：Solid.js中createSignal的基础应用

Question

在Solid.js中，使用createSignal创建一个名为count的信号，初始值为0。然后编写一个函数increment，用于将count的值增加1。请给出完整的代码示例，并解释createSignal返回的两个值分别是什么以及它们的作用。

Answer 1

import { createSignal } from 'solid-js';

const App = () => {
  const [count, setCount] = createSignal(0);

  const increment = () => {
    setCount(count() + 1);
  };

  return (
    <div>
      <p>Count: {count()}</p>
      <button onClick={increment}>Increment</button>
    </div>
  );
};

export default App;

在上述代码中，createSignal(0) 返回一个数组，数组中有两个值：

1. 第一个值（count）：它是当前信号的值的读取器函数。调用 count() 就可以获取当前信号的值。在示例中，{count()} 用于在 JSX 中显示当前 count 的值。

2. 第二个值（setCount）：它是用于更新信号值的函数。通过调用 setCount(newValue)，可以将信号的值更新为 newValue。在示例中，increment 函数通过调用 setCount(count() + 1) 来将 count 的值增加 1。