Beginner question about signals

I have this code:

const signal = createSignal('');

function ShowData(props: any) {
  const data = props.data;

  return data[0]() && <p>...{data[0]()}</p>;
}

export default function Home() {
  return (
    <main class="text-center mx-auto text-gray-700 p-4">
      <ShowData data={signal} />
      <button onclick={() => signal[1](Date.now() + '...')}>Set</button>
    </main>
  );
}

const signal = createSignal('');

function ShowData(props: any) {
  const data = props.data;

  return data[0]() && <p>...{data[0]()}</p>;
}

export default function Home() {
  return (
    <main class="text-center mx-auto text-gray-700 p-4">
      <ShowData data={signal} />
      <button onclick={() => signal[1](Date.now() + '...')}>Set</button>
    </main>
  );
}

How could I make the data in ShowData reactive, i.e. when I click the button, I would see the data?

3 Replies

REEEEE•6mo ago

wrap the return in a fragment

ileOP•6mo ago

That was quick. Thanks 😄

REEEEE•6mo ago

Gaming

Programming

Beginner question about signals