SolidJS

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

SolidJS

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

8/8/2023

Refetching Route Data with Solid Router

Is there any way to refetch (revalidate) the data functions with @solidjs/router? (not Solid Start; I'm using Vite) - I'm mutating something on the backend and would like to make sure the data is up to date - Returning the whole createResource return value kind of works -- calling refetch correctly refetches the data, but mutate doesn't work....

awala

8/8/2023

SolidStart unicode behavior

When I access a pages from parent pages down to the child pages, it renders the unicode perfectly, but when directly access it to the child pages from URL, it renders something like this â€¹. What possibly wrong? Is there any workaround?

kitfre

8/7/2023

Styled Components CSS LSP Support

👋 Hello, I'm both new to solid and front end development as a whole, so apologies if this has been covered. I'm using Solid styled components in a small Todo app project to learn and was wondering if it was possible to get a plugin like https://github.com/styled-components/typescript-styled-plugin to work so my LSP can show me CSS bugs and autofills. I tried configuring the above as recommended and it didn't seem to work, I'm not sure if I need anything solid specific? If it's important, I'm using LazyVim (https://www.lazyvim.org/) as my editor and it's been working great for Solid so far....

ArturAronov

8/7/2023

input loosing focus after each key press

Hello. I have a bug that's been bothering me for couple of days now to which I can't find any solution... Every time when I press the key in input, the text field automatically loses focus. ```ts const [inputAnswers, setInputAnswers] = createStore<Array<string>>(...

Createch

8/7/2023

ESLint error "Promise-returning function provided to attribute where a void return was expected"

I have a createResource and I'm trying to refetch it on button click: ```tsx const App: Component = () => { const [randomNumber, { refetch: refetchNum }] = createResource( async () => await wretch("http://localhost:5000/api/random-number").get().text(),...

pilcrow

8/7/2023

How to throw errors in `createRouteAction()` and `createServerAction$()`?

Am I supposed to throw new Error(), return an error Response, or...?

the magic guy

8/7/2023

createResource / Suspense blocks rendering

Im trying to understand how to handle async data fetching. Taking an example from the docs, with some modifications. This component seem to block rendering for 5 seconds, before displaying Data fetched from API, rather than showing the fallback in the Suspense element while the setTimeout is happening. I feel like im not understanding something here... ```tsx import { createResource, Suspense } from "solid-js"; ...

Carere

8/7/2023

`<script>` tag are loaded at the bottom of body, I need to load them on the `<head>` tag...

Hello all 🙂 I need to use the Font Awesome kit which is available by inserting it into the head tag of the document (<script src="https://kit.fontawesome.com/xxxxxxx.js" crossorigin="anonymous" />) I can see that SolidStart put all the scripts at the end of the body. Is it possible to load some script in the head specifically ?...

o gabriel

8/7/2023

Solid context doesnt work

Learning solid using docs and i use the docs example to create a context but for some reason this error appears, can someone help or give a sugestionon how i can fix? mycode: ``` import { createContext, useContext } from "solid-js"...

tozz

8/6/2023

Reactivity inside closure in return value

I have a function with a store, singals etc. This function returns an object, that object contains a function that is to be used as an event in the caller context. const { onSubmit } = someFunction() The definition of onSubmit inside someFunction ```typescript const onSubmit = (callback: (e: SubmitEvent) => void) => (event: SubmitEvent) => {...

PSY

8/6/2023

Error [RollupError]: "assign" is not exported by "node_modules/solid-js/web/dist/server.js"

When trying to build my solid-start app using solid-start build I get the following error: ``` file:///home/user/code/project/node_modules/rollup/dist/es/shared/node-entry.js:2245 base = Object.assign(new Error(base.message), base);...

Revxrsal

8/6/2023

solid-router not updating when going the same page but with different parameters

o/ so i have this in /routines/[id].tsx: ```tsx export default function EditRoutine() { const params = useParams(); const routineIndex = storage.routines.findIndex(s => s.id == params.id)!;...

Revxrsal

8/6/2023

updating a member inside another member inside an array inside a store using an index

o/ so i have data structured as follows, which is inside a store: ```js { actions: [ {...

navi.ToTskie

8/6/2023

FileRoutes duplicate hydration and not displaying dynamic route

if i used fileroutes the nested route is not working well, but if i used not fileroutes it behave like what i want

Carere

8/6/2023

How to use SolidStart on existing SolidJs project in order to benefit of File Based Routing ?

PS: I use SolidJs only for SPA, so only client-side ? Is it possible to use SolidStart only for client Side ? My goal is to benefit from the organization of SolidStart, i'm used to SolidJs router on client side, but I think it's a little bit messy, so that's why I would like to try SolidStart for Client SIde only rendering (SPA)...

Ziltoid

8/5/2023

How do I modify a member of an object in an array in a SolidJS Store using the SetStoreFunction?

(Re-post from https://stackoverflow.com/questions/76843586/how-do-i-modify-a-member-of-an-object-in-an-array-in-a-solidjs-store-using-the-s , if answered here or vice versa I'll update the other ) Full code is in the stack overflow link^ I'm trying to modify an element of a SolidJS store using the SetStoreFunction (setExpressions)....

Revxrsal

8/5/2023

useParams() not changing when switching pages?

i'm getting really odd behavior ```tsx export default function EditRoutine() { const params = useParams(); createEffect(() => {...

feusanc

8/5/2023

Component doesn't rerender when prop changes

I have the component below: ```ts export default function FolderContents(props: { path: string }) { const [contents] = createResource( async () => await fetch_directory(props.path)...

Revxrsal

8/5/2023

make object no longer reactive

o/ so i have this piece of code ```ts // routines: [] setRoutines(v => [...v, routine]) // routines: [{name: "..."}]...

damon

8/5/2023

Solid Start error

https://damon.systems/projects When loading the page it gets loaded I ge tthis error saying l is null and it looks unrelated to my component, and it works locally I dont really know where to go from here. Here is the component: https://github.com/day-mon/damon.systems/blob/main/src/routes/projects.tsx...

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.