Levi B.
Levi B.
PostsComments
SSolidJS
Created by Levi B. on 12/25/2023 in #support
I keep seeing this pattern in some solid code where dom refs are kept in signals.
That makes sense, thanks
10 replies
SSolidJS
Created by Levi B. on 12/25/2023 in #support
I keep seeing this pattern in some solid code where dom refs are kept in signals.
that means I can reference it in an effect that reruns, when the button node changes. Is that correct?
10 replies
SSolidJS
Created by Levi B. on 12/25/2023 in #support
I keep seeing this pattern in some solid code where dom refs are kept in signals.
I see
10 replies
SSolidJS
Created by anhvu0911 on 5/30/2023 in #support
Reactivity with normal functions
You can also read @ryansolid 's article on building a reactive system, it will help you understand how signals works. https://dev.to/ryansolid/building-a-reactive-library-from-scratch-1i0p
5 replies
SSolidJS
Created by anhvu0911 on 5/30/2023 in #support
Reactivity with normal functions
You can check out how solid reactivity works here in the docs https://www.solidjs.com/guides/reactivity#how-it-works.
5 replies
SSolidJS
Created by Bersaelor on 5/30/2023 in #support
How to get `onMount` to be called on the client for a server-rendered site
Yeah I thought it might be a hydration problem
18 replies
SSolidJS
Created by Bersaelor on 5/30/2023 in #support
How to get `onMount` to be called on the client for a server-rendered site
Yes it's a node server
18 replies
SSolidJS
Created by Levi B. on 5/30/2023 in #support
How to handle auto scrolling in a chat app when new message comes in?
It works but it doesn't feel right, Is there a better way to handle this?
4 replies
SSolidJS
Created by Levi B. on 5/30/2023 in #support
How to handle auto scrolling in a chat app when new message comes in?
OK I've come up with something, just don't know if it's the best 
const App = () => {
  const [messages, setMessages] = createSignal([]);
  let div;

 let autoscroll = true;
  createRenderEffect(
    on(comments, () => {
      autoscroll = div.offsetHeight + div.scrollTop > div.scrollHeight - 100;
    })
  );

  createEffect(
    on(comments, () => {
      if (autoscroll) div.scrollTo(0, div.scrollHeight);
    })
  );

  somechatprovider.on("new", (msg) => {
    setMessages([...messages(), msg])
  })

  return (
    <div ref={container}>
      <For each={messages()}>
        {(message) => (
          <article class={message.author}>
            <span>{message.text}</span>
          </article>
        )}
      </For>
    </div>
  );
};
const App = () => {
  const [messages, setMessages] = createSignal([]);
  let div;

 let autoscroll = true;
  createRenderEffect(
    on(comments, () => {
      autoscroll = div.offsetHeight + div.scrollTop > div.scrollHeight - 100;
    })
  );

  createEffect(
    on(comments, () => {
      if (autoscroll) div.scrollTo(0, div.scrollHeight);
    })
  );

  somechatprovider.on("new", (msg) => {
    setMessages([...messages(), msg])
  })

  return (
    <div ref={container}>
      <For each={messages()}>
        {(message) => (
          <article class={message.author}>
            <span>{message.text}</span>
          </article>
        )}
      </For>
    </div>
  );
};
4 replies
SSolidJS
Created by Bersaelor on 5/30/2023 in #support
How to get `onMount` to be called on the client for a server-rendered site
I'm using onMount in ssr and it runs on the client
18 replies
SSolidJS
Created by Bersaelor on 5/30/2023 in #support
How to get `onMount` to be called on the client for a server-rendered site
That's weird It's supposed to run on the client
18 replies