You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
79 lines
1.9 KiB
79 lines
1.9 KiB
10 years ago
|
var React = require('react');
|
||
|
var classSet = require('classnames');
|
||
|
|
||
|
function isLeftClickEvent(event) {
|
||
|
return event.button === 0;
|
||
|
}
|
||
|
|
||
|
function isModifiedEvent(event) {
|
||
|
return !!(event.metaKey || event.altKey || event.ctrlKey || event.shiftKey);
|
||
|
}
|
||
|
|
||
|
module.exports = {
|
||
|
propTypes: {
|
||
|
activeClassName: React.PropTypes.string.isRequired,
|
||
|
to: React.PropTypes.string.isRequired,
|
||
|
params: React.PropTypes.object,
|
||
|
query: React.PropTypes.object,
|
||
|
onClick: React.PropTypes.func
|
||
|
},
|
||
|
contextTypes: {
|
||
|
router: React.PropTypes.func.isRequired
|
||
|
},
|
||
|
|
||
|
|
||
|
getDefaultProps: function () {
|
||
|
return {
|
||
|
activeClassName: 'active'
|
||
|
};
|
||
|
},
|
||
|
|
||
|
/**
|
||
|
* Returns the value of the "href" attribute to use on the DOM element.
|
||
|
*/
|
||
|
getHref: function () {
|
||
|
return this.context.router.makeHref(this.props.to, this.props.params, this.props.query);
|
||
|
},
|
||
|
|
||
|
/**
|
||
|
* Returns the value of the "class" attribute to use on the DOM element, which contains
|
||
|
* the value of the activeClassName property when this <Link> is active.
|
||
|
*/
|
||
|
getClassName: function () {
|
||
|
var classNames = {};
|
||
|
|
||
|
if (this.props.className) {
|
||
|
classNames[this.props.className] = true;
|
||
|
}
|
||
|
|
||
|
if (this.context.router.isActive(this.props.to, this.props.params, this.props.query)) {
|
||
|
classNames[this.props.activeClassName] = true;
|
||
|
}
|
||
|
|
||
|
return classSet(classNames);
|
||
|
},
|
||
|
|
||
|
handleRouteTo: function (event) {
|
||
|
var allowTransition = true;
|
||
|
var clickResult;
|
||
|
|
||
|
if (this.props.onClick) {
|
||
|
clickResult = this.props.onClick(event);
|
||
|
}
|
||
|
|
||
|
if (isModifiedEvent(event) || !isLeftClickEvent(event)) {
|
||
|
return;
|
||
|
}
|
||
|
|
||
|
if (clickResult === false || event.defaultPrevented === true) {
|
||
|
allowTransition = false;
|
||
|
}
|
||
|
|
||
|
event.preventDefault();
|
||
|
|
||
|
if (allowTransition) {
|
||
|
this.context.router.transitionTo(this.props.to, this.props.params, this.props.query);
|
||
|
}
|
||
|
}
|
||
|
};
|