1
0
Fork 0
mirror of https://github.com/terribleplan/next.js.git synced 2024-01-19 02:48:18 +00:00
next.js/lib/link.js
James O'Dwyer 31feced24a Avoid autoscrolling anchored URLs (#474)
* force scroll to false if # is found in url

* only overwrite scroll if scroll=true is not passed in

* clean up logic around setting scroll var
2016-12-22 17:15:49 +09:00

76 lines
1.8 KiB
JavaScript

import React, { Component, Children } from 'react'
import Router from './router'
export default class Link extends Component {
constructor (props) {
super(props)
this.linkClicked = this.linkClicked.bind(this)
}
linkClicked (e) {
if (e.target.nodeName === 'A' &&
(e.metaKey || e.ctrlKey || e.shiftKey || (e.nativeEvent && e.nativeEvent.which === 2))) {
// ignore click for new tab / new window behavior
return
}
const { href, as } = this.props
if (!isLocal(href)) {
// ignore click if it's outside our scope
return
}
e.preventDefault()
const route = as ? href : null
const url = as || href
// avoid scroll for urls with anchor refs
let { scroll } = this.props
if (scroll == null) {
scroll = url.indexOf('#') < 0
}
// straight up redirect
Router.push(route, url)
.then((success) => {
if (!success) return
if (scroll !== false) window.scrollTo(0, 0)
})
.catch((err) => {
if (this.props.onError) this.props.onError(err)
})
}
render () {
const children = Children.map(this.props.children, (child) => {
const props = {
onClick: this.linkClicked
}
const isAnchor = child && child.type === 'a'
// if child does not specify a href, specify it
// so that repetition is not needed by the user
if (!isAnchor || !('href' in child.props)) {
props.href = this.props.as || this.props.href
}
if (isAnchor) {
return React.cloneElement(child, props)
} else {
return <a {...props}>{child}</a>
}
})
return children[0]
}
}
export function isLocal (href) {
const origin = window.location.origin
return !/^https?:\/\//.test(href) ||
origin === href.substr(0, origin.length)
}