<a href>的小笔记

问题描述

bug: 点击一个<a>的链接后，页面跳转到默认路由（另一个页面）

矛盾点

想要实现的效果是在点击仍在当前页面，页面无跳转

问题解决

代码如下：

  <a onClick={this.toggleFollow.bind(this, item)} href="#">点我</a>

Q1:onClick 和href 哪一个会先触发？
A1:点击后页面发生了跳转，说明href被执行了，测试过程：在toggleFollow中加上console.log(),结果打印出来了值，说明onClick被执行过了。如果href先执行，那么console.log不会打印出来。
结论：onClick 先执行，href 后执行

A2: 当onclick 返回失false时，href还会执行吗？
Q2:实验证明不会执行

A3:怎么样使href 不执行？
Q3:<a href="javascript:void(0)" onclick="subgo()">点我</a>,在这里，javascript:void(0),没启实质上的作用，它仅仅是一个死链接，执行的函数是subgo()。

Q4: 为什么href="#"会跳转到默认的路由？
A4:#包含了一个位置信息默认的锚是#top 也就是网页的上端 ，在react-router中，会跳转到默认路由。