vue.js学习-router-link

简介: vue.js学习-router-link

vue.js


url:


http://localhost:8080/#/block/tbb/0x009cc29c3debf773c76d8d51c0e42c2a0b2a78c3104802304b5b3730c4496bc8
routes:
{      path: '/block/tbb/:blockdata',
      name: 'tbb',
      component: TxByBlock
}


html:


<router-link  :to="'/block/tbb/'+data.hash">{{data.number}}</router-link>

vue:


this.blockhash = this.$route.params.blockdata;



{
      path: '/block/tbb',
      name: 'tbb',
      component: TxByBlock
}
http://localhost:8080/#/block/tbb?blockdata=0x009cc29c3debf773c76d8d51c0e42c2a0b2a78c3104802304b5b3730c4496bc8
<router-link :to="{path:'/block/tbb',query: {blockdata: data.hash}}">
this.blockhash = this.$route.query.blockdata
router.go(n)

这个方法的参数是一个整数,意思是在 history 记录中向前或者后退多少步,类似 window.history.go(n)


router.push(location)

想要导航到不同的 URL,则使用 router.push 方法。这个方法会向 history 栈添加一个新的记录,所以,当用户点击浏览器后退按钮时,则回到之前的 URL。


router.replace(location)

跟 router.push 很像,唯一的不同就是,它不会向 history 添加新记录,而是跟它的方法名一样 —— 替换掉当前的 history 记录。


相关文章
|
24天前
|
JavaScript
vue学习(3)模板语法
vue学习(3)模板语法
49 11
|
15天前
|
JavaScript 前端开发
vue学习(15)watch和computed
vue学习(15)watch和computed
116 58
|
24天前
|
存储 JavaScript 前端开发
vue学习(2)
vue学习(2)
202 65
|
24天前
|
JavaScript 算法 前端开发
vue学习(1)
vue学习(1)
219 62
|
6天前
|
算法 JavaScript 前端开发
第一个算法项目 | JS实现并查集迷宫算法Demo学习
本文是关于使用JavaScript实现并查集迷宫算法的中国象棋demo的学习记录,包括项目运行方法、知识点梳理、代码赏析以及相关CSS样式表文件的介绍。
第一个算法项目 | JS实现并查集迷宫算法Demo学习
|
7天前
|
JavaScript 前端开发 API
紧跟月影大佬的步伐,一起来学习如何写好JS(上)
该文章跟随月影老师的指导,探讨了编写优质JavaScript代码的三大原则:各司其职、组件封装与过程抽象,通过具体示例讲解了如何在实际开发中应用这些原则以提高代码质量和可维护性。
紧跟月影大佬的步伐,一起来学习如何写好JS(上)
|
5天前
|
JavaScript 前端开发 Oracle
软件工程师,学习下JavaScript ES6新特性吧
软件工程师,学习下JavaScript ES6新特性吧
25 9
|
7天前
|
JavaScript 前端开发 算法
紧跟月影大佬的步伐,一起来学习如何写好JS(下)
该文章延续了上篇的内容,进一步探讨了编写优秀JavaScript代码的实践,强调了代码风格一致性、性能优化、团队约定的重要性,并通过实际案例分析了如何在不同场景下写出合适的代码。
|
15天前
|
JavaScript API
vue学习(13)监视属性
vue学习(13)监视属性
30 2
|
23天前
|
JavaScript
vue学习(4)数据绑定
vue学习(4)数据绑定
48 10
下一篇
无影云桌面