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.
function Button(props){
  const [button, setButton] = createSignal();

  return <button ref={setButton}>{props.children}</button>
}
function Button(props){
  const [button, setButton] = createSignal();

  return <button ref={setButton}>{props.children}</button>
}
Is there any advantage to doing it like this?
10 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?
So this is an example what i currently have 
const App = () => {
  const [messages, setMessages] = createSignal([]);
  let div;

  //Div auto scrolls when new message comes in
  createEffect(
    on(messages, () => {
      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;

  //Div auto scrolls when new message comes in
  createEffect(
    on(messages, () => {
      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>
  );
};
Now this works but I want to make it such that when the user has scrolled up to read previous messages it doesn't auto scroll. I can't quite figure out how to go about that in solid.
4 replies
SSolidJS
Created by Levi B. on 3/30/2023 in #support
Nested layouts
Is there a way to opt out of nested layouts for a certain child route in solid-start?
2 replies
SSolidJS
Created by Levi B. on 11/30/2022 in #support
State management
Hello, solid newbie here. Do I have to share signals and stores using the context API, can't I just declare the store/signal outside of the components and just import them?
4 replies