Skip to content

Vue Global Context

Το Slidev κάνει inject ένα global Vue context $slidev για προηγμένες συνθήκες ή χειριστήρια πλοήγησης.

Χρήση

Μπορείτε να έχετε πρόσβαση σε αυτό οπουδήποτε στα markdown και Vue template, με την σύνταξη "Mustache".

md
<!-- slides.md -->

# Σελίδα 1

Η τρέχουσα σελίδα είναι: {{ $slidev.nav.currentPage }}
html
<!-- Foo.vue -->

<template>
  <div>Τίτλος: {{ $slidev.configs.title }}</div>
  <button @click="$slidev.nav.next">Επόμενη Σελίδα</button>
</template>

Ιδιότητες

$clicks

Το $clicks κρατάει έναν αριθμό κλικ στην τρέχουσα διαφάνεια. Μπορεί να χρησιμοποιηθεί υπό όρους για την εμφάνιση διαφορετικού περιεχομένου ανάλογα με τα κλικ.

html
<div v-if="$clicks > 3">Περιεχόμενο</div>

$page

Το $page περιέχει τον αριθμό της τρέχουσας σελίδας, με 1-δείκτη.

md
Σελίδα: {{ $page }}

Είναι ενεργή η τρέχουσα σελίδα: {{ $page === $slidev.nav.currentPage }}

$renderContext

Το $renderContext περιέχει το τρέχον render context, μπορεί να είναι slide, overview, presenter ή previewNext.

md
<div v-if="$renderContext === 'slide'">
  Αυτό το περιεχόμενο θα εμφανίζεται μόνο στην προβολή διαφανειών
</div>

$slidev.nav

Ένα αντιδραστικό object που περιέχει τις ιδιότητες και τα χειριστήρια της πλοήγησης των διαφανειών. Για παραδείγματα:

js
$slidev.nav.next() // πήγαινετε στο επόμενο βήμα

$slidev.nav.nextSlide() // πήγαινετε στην επόμενη διαφάνεια (παραλείψετε ν-clicks)

$slidev.nav.go(10) // πήγαινετε στην διαφάνεια #10
js
$slidev.nav.currentPage // αριθμός τρέχουσας διαφάνειας

$slidev.nav.currentLayout // id τρέχοντος layout

Για περισσότερες διαθέσιμες ιδιότητες, ανατρέξτε στις εξαγωγές του nav.ts.

Σημείωση: Το $slidev.nav.clicks είναι μια global κατάσταση, ενώ το $clicks είναι τοπικό για κάθε διαφάνεια. Συνιστάται η χρήση του $$clicks αντί του $slidev.nav.clicks για να αποφύγετε την αλλαγή των κλικ που ενεργοποιούνται κατά τις μεταβάσεις σελίδων.

$slidev.configs

Ένα αντιδραστικό object κρατάει τις αναλυμένες ρυθμίσεις στο πρώτο frontmatter του slides.md σας. Για παράδειγμα

yaml
---
title: Το πρώτο μου Slidev!
---
{{ $slidev.configs.title }} // 'Το πρώτο μου Slidev!'

$slidev.themeConfigs

Ένα αντιδραστικό object κρατάει τις αναλυμένες ρυθμίσεις του θέματος.

yaml
---
title: Το πρώτο μου Slidev!
themeConfig:
  primary: # 213435
---
{{ $slidev.themeConfigs.primary }} // '#213435'

Διαθέσιμο από v0.43.0

Μια συντομογραφία του $slidev.nav.

Κυκλοφορεί υπό την άδεια MIT License.