面试题：Solid.js中如何实现简单的状态管理

Question

请阐述在Solid.js中，使用`createSignal`进行状态管理的基本步骤，并给出一个示例代码，展示一个包含计数功能的状态管理场景。同时说明`createSignal`返回值的作用分别是什么。

Answer 1

基本步骤

1. 引入createSignal：从solid-js库中导入createSignal函数。
2. 创建信号：调用createSignal函数，传入初始值，它会返回一个数组，包含两个元素。
3. 使用信号：第一个元素是获取当前状态值的函数，第二个元素是更新状态值的函数。

示例代码

import { createSignal } from 'solid-js';
import { render } from 'solid-js/web';

function Counter() {
  const [count, setCount] = createSignal(0);

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

render(() => <Counter />, document.getElementById('app'));

createSignal返回值作用

1. 第一个返回值：是一个函数，调用这个函数可以获取当前状态的值。在示例中count()用于获取当前的计数值。
2. 第二个返回值：是一个函数，调用这个函数并传入新的值，可以更新状态。在示例中setCount(newValue)用于更新计数值。