SolidJS

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

SolidJS

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

6/9/2023

using vanilla js with import?

I am playing around with ways to visualize data and I would like to be able to use vanilla js to do so. I understand that I could do things with onmount and other solid provided techniques but I thought it would be cool to try to import a js file. It did work, but it seems to have been "minified" or whatever happens when your code is built for production. The image provided is actually a whole javascript file that seems to have been stuck inside of index-05a...js , and it works as intended until...

Mr Void

6/9/2023

child-components not updating when parent state is modified.

Paragraph component: https://pastebin.com/raw/Y9tM6qgN Word component: https://pastebin.com/raw/zR6JCYbD...

Grahf

6/9/2023

I don't like refs

Not really a solidJS question but there are smart people here. If there's a rule against this I will remove this post. I am storing a bunch of refs in an array like this: <p ref={(el) => setRefs((p) => [...p, el])}...

Samual 🦢

6/8/2023

`ClientOnly` fallback

I found this code for a client that only runs on the client```ts function ClientOnly(props: { children: JSX.Element }) { const [ getRender, setRender ] = createSignal() onMount(() => setRender(() => props.children)) return getRender as any as JSX.Element...

phungleson

6/8/2023

Reactive in case of dynamic data

Hey peeps, I have an object where it can be any random json. Something like this, https://playground.solidjs.com/anonymous/8670f306-cea1-40d4-9a84-3dbc2caa305f It looks like Solid will lose the object reactivity when changing from array to object, vice versa....

Delvis

6/8/2023

Motion one with exitBeforeEnter doesnt do enter animation

So I have presence component with exitBeforeEnter but it doesnt animate the enter animation only the exit anim. The motion.div is not absolute if that matters. I can post some code later if it helps.

siduck

6/8/2023

The browser resolved template HTML does not match JSX input

Probably due to this i'm unable to click buttons in dev mode but it works in production mode

RONEN

6/7/2023

Cannot exclude an external package from server bundle file

Hello humans. It's been 2 days now that I am struggling with this issue of not being able to exclude @supabase/supabase-js and its dependancies from the final server.js file. I am using Cloudflare workers solid adapter. I've tried all possible combinations to mark the library as external with no luck. Here is my vite.ts file. ``` import solid from 'solid-start/vite' import { defineConfig } from 'vite'...

iNdra

6/7/2023

Which methods do you use for check user login or not?

May I know which methods do you use for check user login or not? Method 1 - Create server session and check database according session details. Method 2 - Use JWT to store in cookies and use that to check in database ...

Mathieu

6/6/2023

Solid Router and losing Contexts

When navigating to a route, I noticed I lose all the context values. I have to wrap the component (that needs to rendered for the route) again by all the context providers, and for every route. Is this normal? It seems awkward. (of course I can create some generic component that wraps the component to render for that route with all the context providers again, but is it normal in the first place that I lose the contexts? If so, how do you approach this?) ```tsx <Route path={translate('uri_select_login_auth_method')}...

Bersaelor

6/5/2023

required Textfield when presented in Safari 16.3 it'll show as `â€‰*

When I use a ```jsx <TextField label="your email" required...

zimo

6/5/2023

Mutate createServerData$ resource

I have a route component that renders countries: ```typescript export function routeData() { const countries = createServerData$(() => prisma.country.findMany());...

iNdra

6/5/2023

Use Common Store in js file and edit it using file 1 then use it in file 2.

I have context.js file and it have following code. `export function createI18n(i18n) { const [store, setStore] = createStore({ ...i18n,...

akerbeltz

6/5/2023

checkbox controlled from outside

I want to control a checkbox from the outside and expose either a function onChange and the props.checked that will be reactive. import { createSignal } from 'solid-js'; import c from './Switch.module.scss'; function SwitchButton(props) {...

Mathieu

6/5/2023

Effects not running after a unhandled promise rejection event

When an unhandled error event occurs (e.g. by throwing new Error()), the ErrorBoundary is catching the error. When an unhandled promise rejection occurs, the UI/JSX is being updated, I display the state of the resource in the JSX, and it switches from pending to errored, but the createEffect functions are not running: ```ts createEffect(() => {...

Bersaelor

6/4/2023

Why is this page with `useParams` and `createResource` not reloading?

```jsx export default function ArticleDetail() { const [article] = createResource(useParams().id, fetchArticle); createEffect(() => {...

zimo

6/4/2023

call `createServerData$` outside Route?

Can I call createServerData$ outside of a Route? I want to put it in a header that is outside of my routes. Do I need to create a "master route" that has children?...

Bersaelor

6/2/2023

`solid-start` site opens multiple `about:blank` on Load

My solid-start page is opening multiple about:blank tabs when loading localhost:3000 . Is there any way to figure out whats causing this?...

Bersaelor

6/2/2023

How to keep/reuse DOM elements across routes?

So, when using solid-start with routes, what is the most idiosyncratic way of keeping one element of the DOM the same, while the user changes pages? I.e. like youtube or spotify, where one element in the DOM is the <audio>/<video> that stays on screen no matter which page I load...

suhaylmv

6/2/2023

Disabling transition on load?

I have a sticky navbar lower in the page which uses an intersection observer to transition to another color when it reaches the top. But the problem is that there's a transition on page load, is there a smart SolidJS way to fix it?

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.