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. 【C语言】猴子吃桃问题

    题目: 猴子第一天吃了若干个桃子,当即吃了一半,还不解馋,又多吃了一个: 第二天,吃剩下的桃子的一半,还不过瘾,又多吃了一个:以后每天都吃前一天剩下的一半多一个,到第10天想再吃时,只剩下一个桃子了. ...

  2. (四)tensorflow-基础(数据类型,张量操作,数学运算)

    摘要: 1.数据类型:标量.向量.矩阵.张量  :数值精度:变量(张量) 2.张量操作:索引.切片.维度操作 3.数学运算:加减乘除(整除和余除):乘方(平方.开方.指数):自然底对数(任意底对数需要 ...

  3. 0216 aop和打印数据库执行日志

    需求 maven依赖 <dependency> <groupId>p6spy</groupId> <artifactId>p6spy</artif ...

  4. 2019-08-07 纪中NOIP模拟B组

    T1 [JZOJ1385] 直角三角形 题目描述 二维平面坐标系中有N个位置不同的点. 从N个点选择3个点,问有多少选法使得这3个点形成直角三角形. 数据范围 $3 \leq N \leq 1500$ ...

  5. OpenCV3.0 + VS2015出现“ACCESS_MASK不明确”错误

    问题:Vs 使用openCV 3.0+ 出错error C2872: “ACCESS_MASK”: 不明确的符号 环境: 系统:Win7 环境:VS2015 64bit 原因: 是因为我项目中的其中一 ...

  6. 少年的u

    发现了我提取DNa的过程存在问题,能够跑出action 但是不能克隆出基因.老师给我解释了为什么,说是我的DNA质量不是很高.但是在接下来的时间我会解决这个问题. 和师姐一起去上面的实验室,看了定量P ...

  7. Python之路Day06

    小数据池 == 判断两个值是否相等 is -- 是,判断两边的内存地址是否相同 a=10 b=10 print(a is b) id() -- 查看内存地址 代码块 一个py文件,一个函数,一个模块, ...

  8. Big research problems (1)

    1. how to measure the uncertainty of prediction model or data analysis? 2.

  9. AD转化器分类及特点和选用

    1. AD转换器的分类 下面简要介绍常用的几种类型的基本原理及特点:积分型.逐次逼近型.并行比较型/串并行型.∑-Δ调制型.电容阵列逐次比较型及压频变换型. 1)积分型(如TLC7135)积分型AD工 ...

  10. Android 开发 微信分享,登陆,获取信息

    1 获取appid和appsecret.        https://open.weixin.qq.com/cgi-bin/index?t=home/index&lang=zh_CN     ...