Gestisci il flusso di narrazione con le label

Il flusso della narrazione è gestito da funzioni quali call, jump, continue, back e closeLabel, tutte disponibili nell'oggetto narration.

Esegui una label

Continua e torna indietro per step

Continua

Per eseguire lo step successivo, utilizzare la funzione narration.continue(). Questa funzione ha i seguenti parametri:

• props: le proprietà da passare alla label. L'interfaccia corrisponde a StepLabelProps.

import { narration } from '@drincs/pixi-vn'

await narration.continue({})

narration.continue() è asincrono, quindi puoi usare .then per, ad esempio, disabilitare un pulsante "Avanti" finché lo step non è completato.

import { narration } from '@drincs/pixi-vn'

// disable next button
narration.continue({})
    .then((result) => {
        // enable next button
    })

Torna indietro

Ad ogni step, il sistema salva lo stato attuale del gioco. Per tornare allo step precedente, utilizza la funzione stepHistory.back().

È necessario passare come parametro la funzione navigate: (path: string) => void. Questa funzione verrà chiamata con il Percorso o Route URL del passaggio precedente, in modo da poter passare alla schermata precedente dell'interfaccia utente.

import { stepHistory } from '@drincs/pixi-vn'
import { useNavigate } from 'react-router-dom';

const navigate = useNavigate();

if (stepHistory.canGoBack) {
    stepHistory.back(navigate).then(() => {
        // ...
    })
}

Chiudere le label