vant/src-next/overlay/index.js
2020-07-06 14:12:22 +08:00

50 lines
1.1 KiB
JavaScript

import { Transition } from 'vue';
import { createNamespace, isDef, noop } from '../utils';
import { preventDefault } from '../utils/dom/event';
const [createComponent, bem] = createNamespace('overlay');
function preventTouchMove(event) {
preventDefault(event, true);
}
export default createComponent({
props: {
show: Boolean,
zIndex: [Number, String],
duration: [Number, String],
className: null,
customStyle: Object,
lockScroll: {
type: Boolean,
default: true,
},
},
setup(props, { slots }) {
return function () {
const style = {
zIndex: props.zIndex,
...props.customStyle,
};
if (isDef(props.duration)) {
style.animationDuration = `${props.duration}s`;
}
return (
<Transition name="van-fade">
<div
vShow={props.show}
style={style}
class={[bem(), props.className]}
onTouchmove={props.lockScroll ? preventTouchMove : noop}
>
{slots.default?.()}
</div>
</Transition>
);
};
},
});