force a dom update when updating a signal before the rest of the onMount function

in this code csvColumns is dependant on setData, how can I force the render update?

  const csvColumns = (
    <Show when={data()}>
      <For each={data()}>{(item, index) => <ConnectionTarget name={item} />}</For>
    </Show>
  );

  onMount(() => {
    const csv = `Name,Email,Age
John Doe,[email protected],30
Jane Smith,[email protected],25
Alice Johnson,[email protected],35
`;
    const rows = csv.split('\n');
    const firstRow = rows[0].split(',');
    setData(firstRow);

    //offload the line drawing
    debugger;
    const colsX = csvColumns.map((component) => component());
  });

  const csvColumns = (
    <Show when={data()}>
      <For each={data()}>{(item, index) => <ConnectionTarget name={item} />}</For>
    </Show>
  );

  onMount(() => {
    const csv = `Name,Email,Age
John Doe,[email protected],30
Jane Smith,[email protected],25
Alice Johnson,[email protected],35
`;
    const rows = csv.split('\n');
    const firstRow = rows[0].split(',');
    setData(firstRow);

    //offload the line drawing
    debugger;
    const colsX = csvColumns.map((component) => component());
  });

5 Replies

fabiospampinato•2y ago

the golden rule is that memos and effects are re-executed and ~nothing else so if you want something to re-execute when some signal changes make sure to wrap the code in a memo or an effect, and read the signal inside that so in this case you should probably make csvColumns a memo Although setData sounds like the setter for a signal, signal presumably called data, signal called data that presumably you are already depending on. So shouldn't this just work? Maybe the value passed to setData is just the old value for data, but mutated (which is not detected as a change)?

BraveheartOP•2y ago

why do need blackbox terms like memo? ><

fabiospampinato•2y ago

memo as in createMemo, one of the main functions in Solid

fabiospampinato•2y ago

https://www.solidjs.com/docs/latest/api#creatememo

SolidJS

Solid is a purely reactive library. It was designed from the ground up with a reactive core. It's influenced by reactive principles developed by previous libraries.

BraveheartOP•2y ago

ill just use effect, easier to understand thx

Gaming

Programming

force a dom update when updating a signal before the rest of the onMount function