Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

[FEATURE REQUEST] Shared element transitions support

Aperta
#119 3 commenti 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
5/5
Tempo stimato
Più di una settimana
Idoneità per principianti
25/100
Tipo di issue
Funzionalità
Chiarezza
Da chiarire
Stato di attività
Ferma
Stack tecnologico
typescript
Ambito
frontend, web-dev

Direzione di ricerca

Non viene indicato alcun file del repository, test o punto di ingresso. Inizia leggendo la guida per sviluppatori collegata di shared-element-transitions e verificando l'attuale modello di transizione del router; il lavoro sarebbe completato quando fosse definito un approccio supportato dai browser per implementare le shared element transitions nelle SPA Solid.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

enhancement

This is likely out of the scope for the time being, especially since the feature is still locked behind the chrome://flags/#document-transition flag in chrome canary.

Some resources on the incoming API in question:

The transitions function by rendering the soon to be page as a separate DOM structure (kinda similar to solid's Portal) then taking a screenshot of both the previous element and the new element. These screenshots get animated in some form before the new page's contents become interactable again.

It would be really cool to see this feature power solid SPAs as soon as browsers begin to support it.

High level, this could look like:


const App = () => {

    return (
        <div style={{width: "100vw", height: "100vh"}}>

            <NavBar />
            
            <Routes>
                <Route path="/" element={<Dashboard/>} />
                <Route path="/content/:id" element={<Content/>} transition={true}  />
            </Routes>

        </div>
    );
};

it's assumed the user has configured any required css to customize the transition.

Lingua principale
TypeScript
Stelle
1.3k
Fork
180
Merge medio
1g 10h
PR unite (30g)
19

Guida per i contributori

Apri la guida per i contributori

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di solidjs/solid-router

Tutte le issue di solidjs/solid-router

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.