SolidJS

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

SolidJS

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

4/2/2023

Why autofocus on input element not work with solid second time

I have this code: https://github.com/nikitavoloboev/kuskus Here I do conditional render of NewTodo: https://github.com/nikitavoloboev/kuskus/blob/main/src/pages/Today.tsx#L14...

Grahf

4/1/2023

Pass ref in routeData

Happy Saturday. Struggling with what I hope is a simple problem. I'm trying to get a ref passed to a grand child component. It keeps showing up as undefined. Ref works fine in the grand parents where it's set to a div. In the grand parent:...

marcusbuffett

4/1/2023

Is there an easy way to render React inside Solid?

I've got a landing page generated through an external tool that I'd rather just keep in React so I don't have to mess with it when we make landing page changes. I've attached an image of what I'm trying to do, but I get a mysterious error in the console about Comp not being defined. Any ideas? Thank you!

romanobro

4/1/2023

Cannot read properties of null (reading 'nextSibling')

Hello, I got this error in production (it was working, then no changes occured), and now I am getting this in development mode too, so I think it was something that changed in solid start that caused this bug. It occurs only when changing pages and goes away on reload. Any suggestions?

MangoPig

4/1/2023

SolidStart: Get Rendered Route Instead in useLocation()

Hello! I'm new to SolidJS and SolidStart. I was wondering if it is possible to get the rendered route of [...404].tsx instead of the actual route location when I use useLocation().pathname....

musiclover

4/1/2023

Solid App to Web Component (js file)

I'm making a single page app in solid and Vite. Can I build my entire solid component to Web Component (single js file) ? I don't want to change each component to web component, i have a lot of components. ...

phungleson

4/1/2023

Stricter JSX?

Hey peeps, I recently upgraded to 1.7.0 and seems like there is new stricter JSX. I read the CHANGELOG and understand the issue a bit, i.e. removing function form from JSX.Element....

Some Call Me Tim

4/1/2023

Firefox Fails loading Font Awesome modules and can't run dev Start Project.

I'm loading up a bunch of icons from various FA packages using their library functionality via import { library } from '@fortawesome/fontawesome-svg-core'; . This works great everywhere except Firefox, where 90+% of the time I just get a white page when trying to load the page after npm run dev. If I hammer F5 enough, it will load 1 out of 10 times, but I've never figured out how to get Solid Start to run constantly on FF with FontAwesome icons....

Guilherme Rosado

3/31/2023

How do I test this behavior?

I want to test the following behavior but I think there's no DOM tree here, right? When we're testing SolidJS components how do I visualize the current tree? ```tsx describe("Turnstile Component", () => { it("renders the Turnstile component", () => { createRoot(() => {...

Silvan

3/31/2023

Get simple fetch data to render

hey guys i feel very stupid asking this question but i cant seem to get this working correctly. i tried multiple things already. The best thing i got yet was my console logging the array but even then i couldnt get anything to render. im using tauri but i dont think that should matter in this context here the problem seem that my getComments in my createResource is never actually ran? ...

Bravi

3/30/2023

How to use <Show> in ssr?

Hi everyone. I have this simple code: ```jsx export default function Home() { const [error, setShowError] = createSignal(false);...

CIA

3/30/2023

Nested layouts

Is there a way to opt out of nested layouts for a certain child route in solid-start?

Grahf

3/30/2023

Show doesn't hide component when signal changes

Hi everyone. I'm having trouble wrapping my head around why a <Show> isn't working the way I think it should work. I have an onClick handler that toggles the signal. A few different onClick handlers are rendered and clicking each one toggles signal appropriately. Then the Show shows the child component with the right props. But when one click handler is clicked the other child components should go away since the conditions in the when block is no longer valid. But I'm just getting more child components each time I click a different event handler when only one child component should be shown. No comprende Tried a few different tactics and this is what I'm working with now. const [selected, setSelected] = createSignal(null)...

Dido

3/29/2023

How to use <Hydration> and <NoHydration>?

Hi there, I was reading the release notes of SolidJS 1.6.0 and it mentions new Components to handle Hydration: <Hydration> and <NoHydration> . https://github.com/solidjs/solid/releases/tag/v1.6.0 I couldn't find any further docs on them. Do they exists yet or does someone have any additional info/reference/example about how to use them?...

Martnart

3/29/2023

document is not defined in HMR

I have some logic that is running in onMount and onCleanup that adds/removes a data-attribute from an element. It works. However when I make a change somewhere in my project, I get document is not defined error from HMR. It seems to be triggered by cleanNode so I am pretty sure it's from the onCleanup. The code itself looks like this shouldn't happen though because I use optional chaining. Any ideas? ```tsx...

Wurfle

3/29/2023

"WARN Issues with peer dependencies found" on fresh project

``` WARN Issues with peer dependencies found . └─┬ solid-start-node 0.2.24 └─┬ @rollup/plugin-node-resolve 13.3.0...

arazorda

3/29/2023

Is it possible for a route to have async data loader?

I want to know if it's possible for a route to have lazy import of a data function, just like in SolidStart, when you're exporting routeData . As you can see on this screenshot, component is being lazily loaded, but the data function is not. I'm thinking about something like this - ```typescript const UserData = () => import("./pages/users/[id].data.js"...

eponymous

3/28/2023

Using solid-element, how do you get the children of a web component?

I'm trying to get the children of a custom component created with solid-element. In plain SolidJS I would simply use props.children, but this is undefined on the solid-element component. Is there a particular way to get this done using solid element?

arazorda

3/28/2023

Can't use `useRouteData`

Hi guys, I'm using basic routing without FileRouter and whenever I'm trying to use useRouteData inside of my component, I'm getting Make sure your app is wrapped in a <Router /> , without using it, everything works just fine. Do you have an idea what can be the issue? I've got a lazy component inside <Route component={

Max

3/27/2023

function prop destructure

Just wondering if there are any implications of passing only accessors or functions as props and then destructuring them vs passing values directly and accessing from props object. I know the reactivity linting is limited in what it can detect but besides that are there some things that should be thought about. More generally are there any good resources to really understand the reactivity system in solid, I've seen some of the older discussion and issues on solid's github has interesting stuff to read but looking for a somewhat structured explanation that goes into some detail....

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.