Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

195
Vistas
how do I make granular signals that works for properties of a whole pure class

I have a class that keeps input events and lets me query the state.

class Input {

  btn() { return this._btn }

  _release() { this._btn = -1 }

  _press() { this._btn = 0 }

  listen() {
    document.addEventListener('keydown', e => this._press())
    document.addEventListener('keyup', e => this._release())
  }

  update() {
   if (this._btn >= 0) this._btn++
  }
}

I use this class like this:

  let input = new Input()
  input.listen()

  function update_every_frame() {
    input.update()
  }
  function check_for_input() {
    if (input.btn() > 0) {
      console.log('here')
    }
  }

So using solid style coding I want to make a signal that changes whenever an input btn is pressed:

  let [input, setInput] = createSignal(new Input(), { equals: false })

  function update_every_frame() {
    setInput(input => { input.update(); return input })
  }


  const check_for_input = () => { return input().btn() }

Now check_for_input is a reactive property that returns the button presses. Except this property up dates every frame because I call input.update every frame.

I don't want granular signals at the data level, where I pollute the pure data class with signals. Be cause I want to make a data class and test it independent of the library.

So how do I make granular signals that works for properties of a whole pure class.

Edit

Also for example how do I create signals or memo's for an array, or a getter property on a class so the signals are updated accordingly when the class updates it's properties:

class Test {
   array: Array

   a: number = 0
   get computed(): {
      return this.a < 4 ? 1 : 0
   }

   update() {
      this.a = 10
   }
}

let [instance, setInstance] = createSignal(new Test(), { equals: false })

let arraySignal = createMemo(() => instance().array)
let computedSignal = createMemo(() =>
  instance.computed)

How does computedSignal update on this method call:

setInstance(instance => instance.update())
about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

One way you can do it is like this:

import {createMutable} from 'solid-js/store'
import {createEffect} from 'solid-js'

class Foo {
  // any properties here
  whatever = 123

  constructor() {
    return createMutable(this)
  }
}

const f = new Foo

createEffect(() => console.log(f.whatever))

f.whatever++ // reactive

or to keep the class really pure:

import {createMutable} from 'solid-js/store'
import {createEffect} from 'solid-js'

class Foo {
  // any properties here
  whatever = 123
}

const f = createMutable(new Foo)

createEffect(() => console.log(f.whatever))

f.whatever++ // reactive

You said you don't want to make signal for every property, but with classy-solid you can do it in a way that still feels like writing a regular class:

import {reactive, signal} from 'classy-solid'

@reactive
class Foo {
  @signal whatever = 123
}

const f = new Foo

createEffect(() => console.log(f.whatever))

f.whatever++ // reactive
about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda