SolidJS

Solid is a declarative reactive Javascript library for creating user interfaces.

SolidJS

Solid is a declarative reactive Javascript library for creating user interfaces.

12/1/2023

show is rendering children when still falsy

I have a simple parent component in a CSR setup ``` const [data] = createResource(params, async ({ id }) => { const out: AlreadyExistingForm = await invoke("get_config", { id: Number(id),...

itsyoboieltr

11/30/2023

Is there a way to use the <For> component with an array of inputs?

everytime I type in one if the inputs output by <For>, I lose focus, because it gets rerendered 😦

shreyasvh

11/30/2023

Issue with createMemo and createInfiniteScroll

I have a solid js application. I have the following component. Basically I have a tours section on the left and years section on the right. When a year is selected on the right, I use the solid-router to navigate to the same page with year param changed to the one selected. I also have infinite scrolling on the tours section. Everytime a year is changed, I set the page to 0. But, weirdly, the page for the infinite scrolling toggles between 0 and 1 whenever I change a year. Ideally, it should always be set to 0. What could I be doing wrong here?...

Lalakis Alfa Ordner

11/30/2023

Sort the data in createStore

This is my first solid-ts app. I got an array of objects and want to sort the by the number field which can be from 0 to an amount. I also want to sort by checkbox checked. I figure that out in javascript. In solid i run this...

DaniGuardiola

11/29/2023

Iterate Set with For?

What's the optimal way to iterate a Set with For? Surely not transforming it into an array right?

navi.ToTskie

11/29/2023

how to not update previous value in array

Darkpouetman

11/28/2023

sync with external data for use in web game

Hello guys, I'm currently working on a game using an ECS library called Miniplex and the 3d library ThreeJS and I think solid would be the perfect library to use to build the UI. The only problem I'm facing is how do I integrate solid with the data from my game engine without making everything a store. Or should I make everything a store? I already have a game loop going every frame and I'm not scared of resyncing the data every frame if necessary. After having a look at the primitives I figured...

boy_koded

11/27/2023

How does solid.js handle complex data structures when working with props

I’m curious about how solid.js handles complex data structures when working with props. Is it using helper functions like filter props and combine props?

alloyed

11/27/2023

implementation detail: enableScheduling uses MessageChannel API?

I can put in the work to polyfill it, but why is it needed to begin with? does the scheduler do any wacky iframe/webworker stuff under the hood?

stiba

11/27/2023

Infinite scrolling solid-start

I'm trying to create something like an infinite scroll. The data I'm fetching requires api-keys etc, so it has to be done server side. The initial data fetches fine, since it's being fetched on the server, but when I try to fetch more, it tries to call my api class from the browser, and the api-key are undefined (naturally)....

aryzing

11/27/2023

Solid.js Playground console doesn't support creating const / let variables

Not sure if a bug or just part of how the Playground's console works, but it doesn't allow creating const or let variables. The regular browser console does. Is this a limitation of having it embedded in the playground, or a bug? Sidenote: should there be a "Playground" support tag?...

Utsuhoagie

11/26/2023

Non-return part of <For>'s callback only seems to run once?

I have a page where I initially fetch a list of items, then I can type in a search box to filter that list on the client, which is part of a form (using createStore()) where it's a list of selected items. I tried to perform the checking logic to see if each "searched item" is part of the "selected items" list, and then do some styling + toggle logic on those items. However, if I do that logic outside the return of <For>'s callback and in the body, then it seems to only run once on first load, and then never again. But it does work if I put it inside the returned JSX for each item instead (which unfortunately means I can't reuse the check-if-already-selected logic). Anyone knows why this is so? It's probably some quirk with Solid that I'm not familiar with. I've done something similar in React and it does work, but it might be one of the big reactivity differences....

itsyoboieltr

11/25/2023

createStore default value with anonymous function

In react I would do something like: ```ts const [array, setArray] = useState(() => { /* some computation */...

Liquido

11/25/2023

How can I use SolidJS ref with typescript?

I want to create a ref to a canvas element: ```tsx export const Canvas = () => { let ref: HTMLCanvasElement;...

chanon_s

11/25/2023

SolidStart SSR + CSR?

Beginner question: I am going to start a project that could be created as an SPA and am wondering a bit whether SolidStart would benefit me. I've used other frameworks before (Nuxt) but it's been a while and I 'm a bit confused. What I'm thinking is when first opening the app to a url in the browser, the server would render the first page for fast page load. Then afterwards if the user clicks on other urls, the client would render it on its own. Does SolidStart SSR already do that? Or does it server-side render every page?...

11/24/2023

Behavior of "Portal" component

Is it possible to use the "Portal" component, so that it won't create additional wrapper (div) around?

AesthetiCoder

11/24/2023

how to put the types to the context

this is the erros i get when trying to use the context, i have the type of the array is this ```ts type ServerModel = {...

Grahf

11/23/2023

__vite_ssr_import_1__.template is not a function

I get the error in the topic when I add this import: import { reporter, ValidationMessage } from '@felte/reporter-solid' Obviously I'm using felt forms and it works fine until I add that import. I should also note that I'm using solidJS in astroJS islands. I did run npm i -S @felte/reporter-solid...

lumenian

11/23/2023

<Show> with number | null

What is the recommended way of using the Show component to conditionally render a number that can possibly be null? Currently, if you do the following, the number won't be rendered if its value is zero. ```tsx <Show when={nullableValue()}> {(value) => <>{value()}</>}...

Yvorie

11/23/2023

Load unknown jsx component after building

I have a component that can take tabs components with their content from other files without knowing them by advance but I need it to work after building. More specifically, I'm already able to do it all in one piece, each tab is a .jsx from another directory, but I can't do it by individually build each part and the main page I need a built main page than can take my jsx tabs (built or not it doesn't matters) without knowing them by advance, completely independently...

Previous Next

Gaming

Programming

SolidJS

Solid is a declarative reactive Javascript library for creating user interfaces.

SolidJS

Solid is a declarative reactive Javascript library for creating user interfaces.