You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: builtin/components.md
+51-12Lines changed: 51 additions & 12 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -4,28 +4,21 @@
4
4
5
5
> The documentations of this section is still working in progress. Before that, you can take a look at the [source code](https://github.com/slidevjs/slidev/blob/main/packages/client/builtin) directly.
6
6
7
-
### `TOC`
7
+
### `Toc`
8
8
9
9
Insert a Table Of Content.
10
10
11
-
Titles and title levels get automatically retrieved from the first title element of each slides.
12
-
13
-
You can override this automatic behaviour for a slide by using the front matter syntax:
14
-
```yml
15
-
---
16
-
title: Amazing slide title
17
-
level: 2
18
-
---
19
-
```
20
-
21
-
Or if you prefer the slide to not appear in the TOC at all, you can use:
11
+
If you want a slide to not appear in the `<Toc>` component, you can use in the front matter block of the slide:
22
12
```yml
23
13
---
24
14
hideInToc: true
25
15
---
26
16
```
27
17
18
+
Titles are displayed using the [`<Titles>` component](#titles)
19
+
28
20
#### Usage
21
+
29
22
~~~md
30
23
<Toc />
31
24
~~~
@@ -41,6 +34,52 @@ Parameters:
41
34
*`'onlyCurrentTree'`: Display only items that are in current tree (active item, parents and children of active item)
42
35
*`'onlySiblings'`: Display only items that are in current tree and their direct siblings
43
36
37
+
### `Link`
38
+
39
+
Insert a link you can use to navigate to a given slide.
40
+
41
+
#### Usage
42
+
43
+
~~~md
44
+
<Link to="42">Go to slide 42</Link>
45
+
<Link to="42" title="Go to slide 42"/>
46
+
~~~
47
+
48
+
Parameters:
49
+
50
+
*`to` (`string | number`): The path of the slide to navigate to (slides starts from `1`)
51
+
*`title` (`string`): The title to display
52
+
53
+
### `Titles`
54
+
55
+
Insert the main title from a slide parsed as HTML.
56
+
57
+
Titles and title levels get automatically retrieved from the first title element of each slides.
58
+
59
+
You can override this automatic behaviour for a slide by using the front matter syntax:
60
+
```yml
61
+
---
62
+
title: Amazing slide title
63
+
level: 2
64
+
---
65
+
```
66
+
67
+
#### Usage
68
+
69
+
The `<Titles>` component is a virtual component you can import with:
70
+
```js
71
+
importTitlesfrom'/@slidev/titles.md'
72
+
```
73
+
74
+
Then you can use it with:
75
+
~~~md
76
+
<Titles no="42" />
77
+
~~~
78
+
79
+
Parameters:
80
+
81
+
*`no` (`string | number`): The number of the slide to display the title from (slides starts from `1`)
82
+
44
83
## Custom Components
45
84
46
85
Create a directory `components/` under your project root, and simply put your custom Vue components under it, then you can use it with the same name in your markdown file!
0 commit comments