mirror of https://github.com/nuxt/nuxt.git
example: Add keep-alive example
This commit is contained in:
parent
cb1a4e9336
commit
4e5959d293
|
@ -0,0 +1,11 @@
|
|||
# <keep-alive> with Nuxt.js
|
||||
|
||||
Introduced in v1.2.0, you can add the `keep-alive` prop to `<nuxt/>` or `<nuxt-child/>` to "keep alive" the pages.
|
||||
|
||||
`layouts/default.vue`:
|
||||
|
||||
```vue
|
||||
<template>
|
||||
<nuxt keep-alive/>
|
||||
</template>
|
||||
```
|
|
@ -0,0 +1,3 @@
|
|||
<template>
|
||||
<nuxt keep-alive/>
|
||||
</template>
|
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"name": "hello-nuxt-keep-alive",
|
||||
"dependencies": {
|
||||
"nuxt": "latest"
|
||||
},
|
||||
"scripts": {
|
||||
"dev": "nuxt",
|
||||
"build": "nuxt build",
|
||||
"start": "nuxt start"
|
||||
}
|
||||
}
|
|
@ -0,0 +1,19 @@
|
|||
<template>
|
||||
<div>
|
||||
<p>Hi from {{ name }}</p>
|
||||
<nuxt-link to="/">Home page</nuxt-link>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
asyncData() {
|
||||
return {
|
||||
name: process.static ? 'static' : (process.server ? 'server' : 'client')
|
||||
}
|
||||
},
|
||||
head: {
|
||||
title: 'About page'
|
||||
}
|
||||
}
|
||||
</script>
|
|
@ -0,0 +1,14 @@
|
|||
<template>
|
||||
<div>
|
||||
<h1>Welcome!</h1>
|
||||
<nuxt-link to="/about">About page</nuxt-link>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
head: {
|
||||
title: 'Home page'
|
||||
}
|
||||
}
|
||||
</script>
|
Loading…
Reference in New Issue