[Content]: using doubleCount variable twice is not possible

[alexmuzenhardt]

📚 Subject area/topic

/guides/state-management.mdx

📋 Page(s) affected (or suggested, for new content)

https://docs.solidjs.com/guides/state-management#derived-state

📋 Description of content that is out-of-date or incorrect

In this section doubleCount is used twice as a variable name. This is not possible. It is not just a typo, therefore, I opened this issue instead of a direct PR.

Snippet:

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

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

  createEffect(() => {
    setDoubleCount(count() * 2); // Update doubleCount whenever count changes
  });

  const doubleCount = () => count() * 2

  return (
    <>
      <div>Current count: {count()}</div>
      <div>Doubled count: {doubleCount()}</div>
      <button onClick={increment}>Increment</button>
    </>
  );
}

Snippet:

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

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

  const doubleCount = () => count() * 2
  const doubleCount = () => {
    console.log('doubleCount called')
    return count() * 2
  }

  return (
    <>
      <div>Current count: {count()}</div>
      <div>Doubled count: {doubleCount()}</div>
      <div>Doubled count: {doubleCount()}</div>
      <div>Doubled count: {doubleCount()}</div>
      <button onClick={increment}>Increment</button>
    </>
  )
}

Suggestions:

• Changing the variable name
• Changing the examples to be more precise. (I think in the example it is not needed to have two doubleCount variables.

If it is fine, I would create a slightly adjusted example for this section and make a PR as proposal.

🖥️ Reproduction in StackBlitz (if reporting incorrect content or code samples)

No response

[alexmuzenhardt]

The examples with using memo are fine and I would leave them as they are.