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/15/2023

Multi-line element truncation

Does anyone know how to achieve the same effect as this library: https://github.com/patrik-piskay/react-truncate-markup It's a library for truncating across multiple lines, something which isn't really possible with CSS. It works by traversing the children of TruncateMarkup, removing certain elements, and testing if the content fits with those elements removed, repeating the process until it succeeds. ...

hannus

12/15/2023

does createResource with multiple signals trigger when onMount

if createResource has one signal which is false as dependency, the resource will be trigger as the signal changing. However, if I set two signals as dependency, the resource triggers in every mount alougth the signals are false . Is there any methods to avoid trigger fetcher when the group signals are false? thanks a lot...

Andre

12/15/2023

Is there a better way of doing this sub and unsub? I fell like I am just translating React code xD

```js function AuthProvider({ children }: { children: JSXElement }) { const [user, setUser] = createSignal<User | null>(null); const [loading, setLoading] = createSignal(true); ...

AesthetiCoder

12/15/2023

Is solids SEO friendly ?

Analyzing the webpage solid generate in production I get problems whit SEO, the same problem that react has, only the div with id root is render, yes the actual page has content but is not reflected in the html, other times I see that the first render of solid is the empty div and then it add the html after, how can I prevent this to happens

Vexcited

12/14/2023

Is there a better way to make authenticated routes ?

Hey! Anybody knows if there's a better way to write specific routes that can be only accessed when a certain condition is fulfilled ? (See attachment: for now in every pages component I check manually with a Show and if true, then redirect to a fallback page using Navigate) I say "better way" because I honestly don't know if there's anything else better than that No Solid-Start, no SSR, only SPA (vite + vite-plugin-solid) and @solidjs/router...

Mr Void

12/14/2023

accessing store multiple time, in batch() causes infinite loop

```ts createEffect(() => { batch(async () => { for (const card of collection.cards) { // some async call ......

Mirardes

12/13/2023

[Solid-Start] [Meta] Encoding Issue

Hello I have an issue with @solidjs/meta on solid-start. When I precise a title with an accent, the accent is replace in the rendered html. Is it normal ? Ex : Démo -> DÃ©mo...

navi.ToTskie

12/13/2023

createresource signal return undifined

  const fetchUser = async (id) =>
  (await fetch(`https://swapi.dev/api/people/${id}/`)).json();

  const fetchUser = async (id) =>
  (await fetch(`https://swapi.dev/api/people/${id}/`)).json();

```tsx...

florian

12/12/2023

Pass every child in props.children a context of their index

I want to create a table where every cell knows its column number without passing it via props. I tried multiple things but they all either didn't work at all or returned undefined when getting the index from the context. Here is how I would like it to work: ```jsx const ColumnContext = createContext(); ...

navi.ToTskie

12/12/2023

official website createresource

https://docs.solidjs.com/guides/how-to-guides/routing-in-solid/solid-router. Under dynamic routes example, does this example work on your local?

navi.ToTskie

12/12/2023

createresource why is this error even on a basic example

i dont know why event the basic example is error

TaQuanMinhLong

12/12/2023

Reanimation

hey, is it possible in solidjs to remount a component to make the animation happen again after the signal is being updated?

Liquido

12/11/2023

How can I set a style based on reactive state with fallback to props?

I want to change color of a button when active and return back to default value when not active: ```tsx const Internal = (props) => { const [clicked, setClicked] = createSignal(false);...

coz

12/11/2023

What is JSX's hoisting behavior?

My code runs now but I wonder what's going on 🙂 if I place ```const a = Test; function Test() {}...

Archit Pandey

12/10/2023

Inputs losing focus on sort

TLDR: Input loses focus when changing the value of the input leads to reordering in a sorted list. I'm creating a table component with Solid. My data is stored in a store: ``` const [data, setData] = createStore([{...}, {...}, {...}...]);...

kdabir

12/10/2023

"Outlet" is not exported by router anymore. How to use 0.10.x of router

We are relying on Outlets for some features to work. What is the upgrade path for updating to 0.10.x of router? is Outlet removed?

12/10/2023

How to pipe/stream file into API Response object?

I'm trying to write an API endpoint with SolidStart which would read a file with fs.createReadStream and pipe it into a Response object which is returned by the API function. I was unable to find a proper solution for this, is it possible at all and how?

HimeHina

12/9/2023

How to implement a webcam component gracefully and correctly?

I am trying to write a webcam component (https://playground.solidjs.com/anonymous/ea52969d-05f3-4da7-b171-1c4a76419fad ). But I am not sure how to stop the webcam stream that is loading when the component is unmounted. The code I implemented is something like this: ```ts const owner = getOwner(); onCleanup(() => {...

Dusty

12/9/2023

Suspending or creating a resource from a Signal

I'm new to solid and trying to integrate it with Dexie. I looked at solid-dexie (https://github.com/faassen/solid-dexie) but I have a couple issues with it so I'm exploring taking it in my own direction. One problem, however, has me stumped. Dexie exports an observable that is easy to link into with from. My issue is that there is a (very short) period between when the signal is defined and when it actually has a value. After that, it's guaranteed to have a value, and the signal fires repeatedly thereafter whenever the db content updates. This means that I have to litter my code with <Show> tags to check if each Dexie query I make actually has content. If only there was a way I could wait for all my signals to have content before I render anything....

Mr Void

12/9/2023

Unable to edit data in store ( Solved )

I have a store function that is meant to update some of the properties of an existing collection within an array of collections. I am trying to update the properties using the Object.assign method: ```ts let collection = { title: "original title", color: "yellow" } // assume > original object...

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.