Primitiva reactiva de SolidJS: signals

Una buena opción para sustituir a Copilot, porque no siempre se puede pagar o se acaba la prueba de 3 meses xD, es Amazon CodeWhisperer.

https://aws.amazon.com/es/codewhisperer/

createSignal es igual a un useState de React. (no sé si en vue o angular el mecanismo es similar).

Signal: Contienen valores que al cambiar actualizaran automáticamente todo aquello que este usando ese valor.

Las primitivas reactivas de SolidJS 🚀

¿Qué son? 🤔

son funciones que crean y gestionan datos reactivos en la aplicación.

Estos datos cambian automáticamente cuando sus dependencias cambian, optimizando las actualizaciones de la interfaz.

SolidJS utiliza las primitivas, como signals, memos y effects, para detectar y reaccionar a los cambios en los datos. Estas primitivas se crean con la palabra clave create.

//import logo from './logo.svg';
import styles from './App.module.css';
import { createEffect, createSignal } from 'solid-js';
const [count, setCount] = createSignal(0);

let intervalId;

function App() {
  const handleIncrement = (step) => setCount(Math.max(count() + step, 0));
  const handleMouseDown = (step) => intervalId = setInterval(() => handleIncrement(step), 200);
  const handleMouseUp = () => clearInterval(intervalId);


  return (
    <div class={styles.App}>
      <h1>Count: {count()}</h1>
      <button
        onClick={() => handleIncrement(1)}
        onMouseDown={() => handleMouseDown(1)}
        onMouseUp={handleMouseUp}>
        +
      </button>
      <button
        onClick={() => handleIncrement(-1)}
        onMouseDown={() => handleMouseDown(-1)}
        onMouseUp={handleMouseUp}>
        -
      </button>
    </div>
  );
}

export default App;