Nuxt 路由可以使用a标签进行链接跳转,例如我们创建了一个demo.vue的文件

<p>
<a href="/demo">跳转去Demo页面</a>
</p>

但是Nuxt中有专属的标签 nuxt-link, 因此上次可以改写为:

<p>
<nuxt-link :to="{name: 'demo'}">跳转去Demo页面</nuxt-link>
</p>

注: 在实际开发中,尽量使用标签进行跳转

Nuxt传参其实也是比较好理解的

例如我们现在新建一个commodity.vue文件,然后新建一个details文件夹,并新建一个index.vue , 要求是从commodity.vue 传递参数, 在index.vue 中接收

commodity.vue

<p>
<nuxt-link :to="{name: 'details', params: {id: 123}}">跳转去Demo页面</nuxt-link>
</p>

index.vue

<p>传递过来的参数:{{$route.params.id}}</p>

Nuxt的路由配置以及传参的更多相关文章

  1. vue路由(一个包含重定向、嵌套路由、懒加载的main.js如下)and 路由跳转传参的query和params的异同

    import Vue from 'vue'import VueRouter from 'vue-router'import App from './App'Vue.use(VueRouter)cons ...

  2. Vue Router路由导航及传参方式

    路由导航及传参方式 一.两种导航方式 ①:声明式导航 <router-link :to="..."> ②:编程式导航 router.push(...) 二.编程式导航参 ...

  3. Angular:路由的配置、传参以及跳转

    ①路由的配置 1.首先用脚手架新建一个项目,在路由配置时选择yes 2.用ng g component创建组件 3.在src/app/app-routing.module.ts中配置路由 import ...

  4. Vue ---- 组件文件分析 组件生命周期钩子 路由 跳转 传参

    目录 Vue组件文件微微细剖 Vue组件生命周期钩子 Vue路由 1.touter下的index.js 2.路由重定向 3.路由传参数 补充:全局样式导入 路由跳转 1. router-view标签 ...

  5. Vue之路由跳转 传参 aixos 和cookie

    一.路由跳转 1.1 项目的初始化 vue create m-proj   >>>创建vue项目 精简vue项目的 views 视图   About(基本是删除的) Home.(可以 ...

  6. Tornado学习笔记(二) 路由/post/get传参

    本章我们学习 Tornado 的路由传参等问题 路由 路由的匹配 Tornado的路由匹配采用的是正则匹配 一般情况下不需要多复杂的正则,正则的基本规则如下(站长之家) 举个例子 (r'/sum/(\ ...

  7. ionic简单路由及页面传参

    1)页面跳转及传参方法 angular.module('app.routes', [])//routes路由模型 .config(function($stateProvider, $urlRouter ...

  8. vue2.0路由写法、传参和嵌套

    前置知识请戳这里 vue-routerCDN地址:https://unpkg.com/vue-router@3.0.1/dist/vue-router.js vue-router下载地址:https: ...

  9. vue-router路由如何实现传参

    tip: 用params传参,F5强制刷新参数会被清空,用query,由于参数适用路径传参的所以F5强制刷新也不会被清空.(传参强烈建议适用string) 也可以选用sessionstorage/lo ...

随机推荐

  1. ctf-ping命令执行绕过

    题目连接:http://ctf.klmyssn.com/challenges#Ping 命令执行绕过,试了试过滤了一些:一些命令 但是反引号可以执行命令 通过拼接,可以拼接出来:ls 命令 127.0 ...

  2. wx: wx.showModal 回调函数中调用自定义方法

    一.在回调函数中调用自定义方法: 回调函数中不能直接使用this,需要在外面定义 var that = this 然后 that.自定义的方法.如下: //删除 onDelete: function ...

  3. java编码解码过程

    最近做项目的时候,有时会遇到中文乱码的问题,网上查询了很多资料,发现大多都是只讲解决方案,并没有讲到为什么要使用这种方案,这种方案的原理是什么? 最典型的就是连接数据库的URL,我们一般把它放到cla ...

  4. 转载:dsp芯片的定点运算

    转自: http://ishare.iask.sina.com.cn/f/37179153.html

  5. CLOUD将excel数据引入单据体

    http://club.kingdee.com/forum.php?mod=viewthread&tid=989239 http://club.kingdee.com/forum.php?mo ...

  6. [CF1304C] Air Conditioner

    维护一区间 \([l,r]\) 人按照时间升序 考虑 \((l_i, h_i, t_i)\),当前的所有区间与这个区间取交 推到 \(t_{i+1}\) 时,所有区间的端点向两边扩张即可 注意把空掉的 ...

  7. Learn from Niu 2020.1.28

    1. 泛读和精度的区别和迭代: 泛读: 1个月之内,读50篇论文,进行粗读,了解多维时间序列信号,有哪些research problem, challenges, research groups, r ...

  8. Dubbo快速入门

    Dubbo作为一个RPC框架,其最核心的功能就是要实现跨网络的远程调用.这次创建两个应用,一个作为服务的提供方,一个作为服务的消费方.通过Dubbo来实现服务消费方远程调用服务提供方的方法. 服务提供 ...

  9. ZJOI2006 书架 lg2596

    题面见https://www.luogu.org/problemnew/show/P2596 题面就是描述了一个书柜从上到下放着书,可以看作一个序列,每个数的序号为它在从上向下数第几本 一开始建树偷了 ...

  10. eclipse中tomcat正常启动,但浏览器访问不了tomcat首页之tomcat配置问题

    症状: tomcat在eclipse里面能正常启动,而在浏览器中访问http://localhost:8080/不能访问,且报404错误.同时其他项目页面也不能访问. 关闭eclipse里面的tomc ...