Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2025-02-16 13:48:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

docs: use consistent indentation in examples (#19342)

Browse Source
This commit is contained in:
Mahdi Shah abbasian 2023-03-01 01:01:41 +03:30 committed by GitHub
parent 639189ca88
commit 6009deb24e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 25 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
docs/1.getting-started/5.seo-meta.md
View File

@ -103,6 +103,7 @@ use the computed getter syntax, the same as `useHead`.
```vue{}[app.vue]
<script setup lang="ts">
const data = useFetch(() => $fetch('/api/example'))
useServerSeoMeta({
ogTitle: () => `${data.value?.title} - My Site`,
description: () => data.value?.description,
@ -191,10 +192,11 @@ It's recommended to use computed getters (`() => {}`) over computed (`computed((
<script setup>
const desc = ref('My amazing site.')
</script>
<template>
<div>
<Meta name="description" :content="desc" />
</div>
<div>
<Meta name="description" :content="desc" />
</div>
</template>
```
@ -212,11 +214,11 @@ If you want to use a function (for full control), then this cannot be set in you
```vue [useHead]
<script setup lang="ts">
useHead({
titleTemplate: (titleChunk) => {
return titleChunk ? `${titleChunk} - Site Title` : 'Site Title';
}
})
useHead({
titleTemplate: (titleChunk) => {
return titleChunk ? `${titleChunk} - Site Title` : 'Site Title';
}
})
</script>
```
@ -282,17 +284,17 @@ In the example below, `titleTemplate` is set either as a string with the `%s` pl
```vue [app.vue]
<script setup>
useHead({
// as a string,
// where `%s` is replaced with the title
titleTemplate: '%s - Site Title',
// ... or as a function
titleTemplate: (productCategory) => {
return productCategory
? `${productCategory} - Site Title`
: 'Site Title'
}
})
useHead({
// as a string,
// where `%s` is replaced with the title
titleTemplate: '%s - Site Title',
// ... or as a function
titleTemplate: (productCategory) => {
return productCategory
? `${productCategory} - Site Title`
: 'Site Title'
}
})
</script>
```
@ -324,10 +326,10 @@ The example below shows how you might enable Google Fonts using either the `link
```vue [Components]
<template>
<div>
<Link rel="preconnect" href="https://fonts.googleapis.com" />
<Link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" crossorigin="" />
</div>
<div>
<Link rel="preconnect" href="https://fonts.googleapis.com" />
<Link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" crossorigin="" />
</div>
</template>
```