SolidJS

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

Join

SolidJS

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

Join

Boku 🜲

1/11/2023

how do i make my component to accept class and classList ?

baxuz

1/10/2023

disposing of a `createRoot` nested inside a `createEffect`?

I am creating a nested effect, like: ```ts createEffect(() => { // create nested effect...

Your local wobbler: Suya

1/10/2023

SSR build failing

I'm attempting to get solid SSR working with deno via esbuild and esbuild-plugin-solid. In order to access solid, I have an import map where solid-js uses npm:solid-js and solid-js/web, ditto. In order to run the app, I need to import the SSR build. However, the following error occurs ```...

Tom

1/10/2023

solid-router nested routes - access child params from parent component

It seems like a parent component can't access the full set of params - it can't see params for child routes. Is that right? I get the logic but I have a classic master/detail view, list on the left, with a selected item showing up on the right. In the list I need to be able to detect which item is active, which depends on the nested route param which is not available. My routes:...

Razboy20

1/10/2023

Math.random() overwritten on hydration

I have a skeleton component which I want to have a slight randomness to its width, so I have

<span class="skeleton-text text-clip whitespace-nowrap">{"a".repeat(7 + Math.floor(Math.random() * 20))}</span>

<span class="skeleton-text text-clip whitespace-nowrap">{"a".repeat(7 + Math.floor(Math.random() * 20))}</span>

However, on hydration, the inner text of the span is removed....

bigmistqke

1/9/2023

how to add package to https://www.solidjs.com/ecosystem?

I made a package and would like to add it to the solidjs website. Is there a write-up somewhere how to contribute?

bigmistqke

1/9/2023

window.getComputedStyle returns react-style CSSStyleDeclaration?

if i const style = window.getComputedStyle(node) style has type CSSStyleDeclaration which follows react's camelCase formatting. I could cast it to JSX.CSSProperties but JSX.CSSProperties allow for numbers | string while window.getComputedStyle only returns string. what would be the solid way to type this?...

Revxrsal

1/9/2023

add fade-in and fade-out animations when navigating routes (using solid-routes)

o/ is there any way to add some sort of fade-in and fade-out animations when navigating between routes? this is what i basically have at the moment ```ts <ErrorBoundary fallback={<p>some problem</p>}> <Routes> <Route path="/" component={Home}/>...

Ho-kage

1/9/2023

Loading google fonts

I'm trying to load a google font with the <Link> component but it doesn't seem to be working <Link href="https://fonts.googleapis.com/css2?family=Cedarville+Cursive&family=Recursive:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" /> It puts an <a> tag in the body with link=true as an attribute but nothing the font is not working....

Kasper

1/9/2023

Resource not being called when componet loads

I have create a resource, that i want to update when the "cursor" is changed. I followed the tutorial, but this dose not load when the componet loads. ``` const fetchSubjects = async (source: any, { value, refetching }: any) => { console.log("fetching subjects", source, value); return await await urqlClient().query(GET_SUBJECTS, { after: "", first: 2 }).toPromise();...

Grahf

1/9/2023

Updating signal value doesn't always update DOM?

I have a situation where on line 98 here (https://stackblitz.com/edit/solidjs-templates-gguy1g?file=README.md,src%2Fcomponents%2Fbook-parts%2FSlider.jsx) the maxPage() state/signal)is being updated and set as the inputs max value correctly. But on line 136 where the value of maxPage() is displayed the maxPage() state/signal value isn't updated every time it changes value. I submit as evidence this screen shot showing that I can set the inputs max value one past what's being displayed as the maxPage() value but no further. No issues at all as long as maxPage() value doesn't change but when it changes the displayed value and behavior don't align. I am adding and removing elements that would affect the maxPage() value and the input max attribute is always updated correctly but not the <h3> elements displaying the value of maxPage()...

bigmistqke

1/8/2023

vite-template for building libraries

Is there a vite-template for writing ts (component-) libraries for solid? I can not seem to get the config right to bundle with type declaration-files.

Ping for toast

1/8/2023

Await Resource

I have an authentication context wrapping the router ```tsx export const [SessionProvider, useSession] = createContextProvider(() => { const cookie = isServer ? useRequest().request.headers.get("cookie") ?? ""...

bigmistqke

1/8/2023

get types of HTMLElement-attributes

Is there a way to get the attributes of an HTMLElement? Similar to React.TextareaHTMLAttributes<HTMLTextAreaElement>? Can't seem to find anything about in the docs...

Robin Lindner

1/8/2023

Passive Event Listeners

How can I mark onWheel as { passive: true } ```jsx import "./NewsElements.scss"; import { NewsElement } from "./NewsElement";...

Max

1/7/2023

Using lifecycle functions in abstract function?

Just wondering if there are any consideration to be taken into account when calling lifecycle functions like onMount or onCleanup inside some abstracted function made to reuse code, like a hook in react. Would it work fine so long as the function gets called in a component, or anything else to keep in mind? And is this something inline with what custom directives like use are designed for, or its unrelated? ...

Robin Lindner

1/6/2023

Modals in SolidJS

Is there some proper way implementing modals in solid? I have a special button component and I want to open a modal on clicking this button. I read something about Portal. Can you help me here :)? ...

Revxrsal

1/6/2023

route not rendering sometimes

o/ so I have two routes: the index one (home) and the /settings one. here's my root.tsx: https://pastebin.com/K8ykT5C2 here's my settings.tsx: ```ts export default function Settings() { return (...

D0Z

1/6/2023

Argument of type 'StoreState' is not assignable to parameter of type 'PartStoreState, layers'

Am I dumb ? I think so... the error occur in setOne method declaration ```ts...

Kasper

1/6/2023

Why dose createServerData$ return undefined

I am learning solid start, i am having some issues getting routeData and createServerData to work correctly, the below example prints Test: undefined where it should return Test: { Foo: "Bar" } ``` export function routeData() { const user = createServerData$(async (_, { request }) => { return {...

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.