Replace router-link to nuxt-link

This commit is contained in:
Sébastien Chopin 2016-12-16 18:12:38 +01:00
parent 36f3d48ece
commit 0142dae008
30 changed files with 45 additions and 45 deletions

View File

@ -2,7 +2,7 @@
<template>
<div>
<p>{{ userAgent }}</p>
<p><router-link to="/post">See a post (http request / Ajax)</router-link></p>
<p><nuxt-link to="/post">See a post (http request / Ajax)</nuxt-link></p>
</div>
</template>

View File

@ -2,7 +2,7 @@
<template>
<div>
<p>{{ post.title }}!</p>
<p><router-link to="/">Back home</router-link></p>
<p><nuxt-link to="/">Back home</nuxt-link></p>
</div>
</template>

View File

@ -183,7 +183,7 @@ Let's add a `/secret` route where only the connected user can see its content:
<template>
<div>
<h1>Super secret page</h1>
<router-link to="/">Back to the home page</router-link>
<nuxt-link to="/">Back to the home page</nuxt-link>
</div>
</template>

View File

@ -14,7 +14,7 @@
<p><i>You can also refresh this page, you'll still be connected!</i></p>
<button @click="logout">Logout</button>
</div>
<p><router-link to="/secret">Super secret page</router-link></p>
<p><nuxt-link to="/secret">Super secret page</nuxt-link></p>
</div>
</template>

View File

@ -2,7 +2,7 @@
<div>
<h1>Super secret page</h1>
<p>If you try to access this URL not connected, you will be redirected to the home page (server-side or client-side)</p>
<router-link to="/">Back to the home page</router-link>
<nuxt-link to="/">Back to the home page</nuxt-link>
</div>
</template>

View File

@ -1,7 +1,7 @@
<template>
<div class="container">
<p>About Page</p>
<router-link to="/">Go to /</router-link>
<nuxt-link to="/">Go to /</nuxt-link>
</div>
</template>

View File

@ -1,7 +1,7 @@
<template>
<div class="container">
<p>Hello {{ name }}!</p>
<router-link to="/about">Go to /about</router-link>
<nuxt-link to="/about">Go to /about</nuxt-link>
</div>
</template>

View File

@ -6,24 +6,24 @@
</h1>
<ul class="Navbar__Links">
<li class="Navbar__Links__Item">
<router-link to="/team" class="Navbar__Links__Item__Link">
<nuxt-link to="/team" class="Navbar__Links__Item__Link">
Basic route
</router-link>
</nuxt-link>
</li>
<li class="Navbar__Links__Item">
<router-link to="/projects" class="Navbar__Links__Item__Link">
<nuxt-link to="/projects" class="Navbar__Links__Item__Link">
Dynamic routes
</router-link>
</nuxt-link>
</li>
<li class="Navbar__Links__Item">
<router-link to="/users" class="Navbar__Links__Item__Link">
<nuxt-link to="/users" class="Navbar__Links__Item__Link">
Nested routes
</router-link>
</nuxt-link>
</li>
<li class="Navbar__Links__Item">
<router-link to="/posts" class="Navbar__Links__Item__Link">
<nuxt-link to="/posts" class="Navbar__Links__Item__Link">
Dynamic nested routes
</router-link>
</nuxt-link>
</li>
</ul>
</nav>
@ -96,6 +96,10 @@ a, a:hover
color: #41B883;
}
.nuxt-link-active {
color: #41B883 !important;
}
.fade-enter-active, .fade-leave-active {
transition: opacity .3s;
}

View File

@ -2,9 +2,9 @@
<div class="container">
<h2>Posts list</h2>
<p>
<router-link to="/posts/welcome">
<nuxt-link to="/posts/welcome">
Welcome post
</router-link>
</nuxt-link>
</p>
</div>
</template>

View File

@ -3,9 +3,9 @@
<h1>Dynamic route example</h1>
<h2>Projects list</h2>
<p>
<router-link :to="{ name: 'projects-slug', params: { slug: 'nuxtjs'} }">
<nuxt-link :to="{ name: 'projects-slug', params: { slug: 'nuxtjs'} }">
Nuxt.js
</router-link>
</nuxt-link>
</p>
</div>
</template>

View File

@ -4,7 +4,7 @@
<h2>Users list</h2>
<ul class="users">
<li v-for="user in users">
<router-link :to="{ name: 'users-id', params: { id: user.id } }">{{ user.name }}</router-link>
<nuxt-link :to="{ name: 'users-id', params: { id: user.id } }">{{ user.name }}</nuxt-link>
</li>
</ul>
<nuxt-child :key="$route.params.id"></nuxt-child>
@ -43,7 +43,4 @@ export default {
.users li a:hover {
color: #41b883;
}
.router-link-active {
color: #41b883 !important;
}
</style>

View File

@ -4,7 +4,7 @@
<h3>{{ user.name }}</h3>
<h4>@{{ user.username }}</h4>
<p>Email : {{ user.email }}</p>
<p><router-link to="/users">List of users</router-link></p>
<p><nuxt-link to="/users">List of users</nuxt-link></p>
</div>
</template>

View File

@ -1,7 +1,7 @@
<template>
<div>
<p>Hi from {{ name }}</p>
<router-link to="/">Home page</router-link>
<nuxt-link to="/">Home page</nuxt-link>
</div>
</template>

View File

@ -1,6 +1,6 @@
<template>
<div class="container">
<h1>Welcome!</h1>
<router-link to="/about">About page</router-link>
<nuxt-link to="/about">About page</nuxt-link>
</div>
</template>

View File

@ -1,7 +1,7 @@
<template>
<div class="content">
<h1 class="title">Another Page</h1>
<p><router-link to="/" class="button is-medium is-info hvr-wobble-vertical">Another button</router-link></p>
<p><router-link to="/">Back home</router-link></p>
<p><nuxt-link to="/" class="button is-medium is-info hvr-wobble-vertical">Another button</nuxt-link></p>
<p><nuxt-link to="/">Back home</nuxt-link></p>
</div>
</template>

View File

@ -1,7 +1,7 @@
<template>
<div class="content">
<h1 class="title">Custom CSS!</h1>
<p><router-link to="/about" class="button is-medium is-primary hvr-float-shadow">I am a button</router-link></p>
<p><router-link to="/about">About page</router-link></p>
<p><nuxt-link to="/about" class="button is-medium is-primary hvr-float-shadow">I am a button</nuxt-link></p>
<p><nuxt-link to="/about">About page</nuxt-link></p>
</div>
</template>

View File

@ -3,7 +3,7 @@
<h1>About page</h1>
<p>Click below to see the custom meta tags added with our custom component <code>twitter-head-card</code></p>
<twitter-head-card></twitter-head-card>
<p><router-link to="/">Home page</router-link></p>
<p><nuxt-link to="/">Home page</nuxt-link></p>
</div>
</template>

View File

@ -1,7 +1,7 @@
<template>
<div class="container">
<h1>Home page 🚀</h1>
<router-link to="/about">About page</router-link>
<nuxt-link to="/about">About page</nuxt-link>
</div>
</template>

View File

@ -1,6 +1,6 @@
<template>
<div>
<h1>Welcome!</h1>
<router-link to="/about">About page</router-link>
<nuxt-link to="/about">About page</nuxt-link>
</div>
</template>

View File

@ -1,7 +1,7 @@
<template>
<div class="container">
<img :src="thumbnailUrl" />
<p><router-link to="/">Home</router-link> - About</p>
<p><nuxt-link to="/">Home</nuxt-link> - About</p>
</div>
</template>

View File

@ -1,7 +1,7 @@
<template>
<div class="container">
<p><button @click="showLoginError">Notif me!</button></p>
<p>Home - <router-link to="/about">About</router-link></p>
<p>Home - <nuxt-link to="/about">About</nuxt-link></p>
</div>
</template>

View File

@ -71,7 +71,7 @@ To define a custom transition for a specific route, simply add the `transition`
<template>
<div class="container">
<h1>About page</h1>
<router-link to="/">Home page</router-link>
<nuxt-link to="/">Home page</nuxt-link>
</div>
</template>

View File

@ -1,7 +1,7 @@
<template>
<div class="container">
<h1>About page</h1>
<router-link to="/">Home page</router-link>
<nuxt-link to="/">Home page</nuxt-link>
</div>
</template>

View File

@ -1,6 +1,6 @@
<template>
<div class="container">
<h1>Home page</h1>
<router-link to="/about">About page</router-link>
<nuxt-link to="/about">About page</nuxt-link>
</div>
</template>

View File

@ -3,7 +3,7 @@
<img src="~static/nuxt-black.png" />
<h2>Thank you for testing nuxt.js</h2>
<p>Loaded from the {{ name }}</p>
<p><router-link to="/">Back home</router-link></p>
<p><nuxt-link to="/">Back home</nuxt-link></p>
</div>
</template>

View File

@ -2,7 +2,7 @@
<div class="container">
<img src="nuxt.png" />
<h2>Hello World.</h2>
<p><router-link to="/about">About</router-link></p>
<p><nuxt-link to="/about">About</nuxt-link></p>
</div>
</template>

View File

@ -2,7 +2,7 @@
<div>
<p>
<button @click="$store.commit('increment')">{{ $store.state.counter }}</button><br>
<router-link to="/">Home</router-link>
<nuxt-link to="/">Home</nuxt-link>
</p>
</div>
</template>

View File

@ -2,7 +2,7 @@
<div>
<p>
<button @click="increment">{{ counter }}</button><br>
<router-link to="/about">About</router-link>
<nuxt-link to="/about">About</nuxt-link>
</p>
</div>
</template>

View File

@ -5,7 +5,7 @@
<div class="error-wrapper-message">
<h2 class="error-message">{{ error.message }}</h2>
</div>
<p v-if="error.statusCode === 404"><router-link class="error-link" to="/">Back to the home page</router-link></p>
<p v-if="error.statusCode === 404"><nuxt-link class="error-link" to="/">Back to the home page</nuxt-link></p>
</div>
</div>
</template>

View File

@ -39,8 +39,7 @@ class Nuxt {
},
router: {
base: '/',
linkActiveClass: 'router-link-active',
routes: {}
linkActiveClass: 'nuxt-link-active'
},
build: {}
}