120 lines
2.5 KiB
Vue
120 lines
2.5 KiB
Vue
import classnames from '../_util/classNames';
|
|
import { cloneElement } from '../_util/vnode';
|
|
import { canGoNext } from './utils/innerSliderUtils';
|
|
|
|
function noop() {}
|
|
|
|
function handler(options, handle, e) {
|
|
if (e) {
|
|
e.preventDefault();
|
|
}
|
|
handle(options, e);
|
|
}
|
|
|
|
const PrevArrow = (_, { attrs }) => {
|
|
const { clickHandler, infinite, currentSlide, slideCount, slidesToShow } = attrs;
|
|
const prevClasses = { 'slick-arrow': true, 'slick-prev': true };
|
|
let prevHandler = function (e) {
|
|
handler({ message: 'previous' }, clickHandler, e);
|
|
};
|
|
|
|
if (!infinite && (currentSlide === 0 || slideCount <= slidesToShow)) {
|
|
prevClasses['slick-disabled'] = true;
|
|
prevHandler = noop;
|
|
}
|
|
|
|
const prevArrowProps = {
|
|
key: '0',
|
|
'data-role': 'none',
|
|
class: prevClasses,
|
|
style: { display: 'block' },
|
|
onClick: prevHandler,
|
|
};
|
|
const customProps = {
|
|
currentSlide,
|
|
slideCount,
|
|
};
|
|
let prevArrow;
|
|
|
|
if (attrs.prevArrow) {
|
|
prevArrow = cloneElement(
|
|
attrs.prevArrow({
|
|
...prevArrowProps,
|
|
...customProps,
|
|
}),
|
|
{
|
|
key: '0',
|
|
class: prevClasses,
|
|
style: { display: 'block' },
|
|
onClick: prevHandler,
|
|
},
|
|
false,
|
|
);
|
|
} else {
|
|
prevArrow = (
|
|
<button key="0" type="button" {...prevArrowProps}>
|
|
{' '}
|
|
Previous
|
|
</button>
|
|
);
|
|
}
|
|
return prevArrow;
|
|
};
|
|
|
|
PrevArrow.inheritAttrs = false;
|
|
|
|
const NextArrow = (_, { attrs }) => {
|
|
const { clickHandler, currentSlide, slideCount } = attrs;
|
|
|
|
const nextClasses = { 'slick-arrow': true, 'slick-next': true };
|
|
let nextHandler = function (e) {
|
|
handler({ message: 'next' }, clickHandler, e);
|
|
};
|
|
if (!canGoNext(attrs)) {
|
|
nextClasses['slick-disabled'] = true;
|
|
nextHandler = noop;
|
|
}
|
|
|
|
const nextArrowProps = {
|
|
key: '1',
|
|
'data-role': 'none',
|
|
class: classnames(nextClasses),
|
|
style: { display: 'block' },
|
|
onClick: nextHandler,
|
|
};
|
|
const customProps = {
|
|
currentSlide,
|
|
slideCount,
|
|
};
|
|
let nextArrow;
|
|
|
|
if (attrs.nextArrow) {
|
|
nextArrow = cloneElement(
|
|
attrs.nextArrow({
|
|
...nextArrowProps,
|
|
...customProps,
|
|
}),
|
|
{
|
|
key: '1',
|
|
class: classnames(nextClasses),
|
|
style: { display: 'block' },
|
|
onClick: nextHandler,
|
|
},
|
|
false,
|
|
);
|
|
} else {
|
|
nextArrow = (
|
|
<button key="1" type="button" {...nextArrowProps}>
|
|
{' '}
|
|
Next
|
|
</button>
|
|
);
|
|
}
|
|
|
|
return nextArrow;
|
|
};
|
|
|
|
NextArrow.inheritAttrs = false;
|
|
|
|
export { PrevArrow, NextArrow };
|