mirror of
https://gitee.com/vant-contrib/vant.git
synced 2026-07-14 09:41:05 +08:00
Compare commits
2 Commits
db97581969
...
6244161d6b
| Author | SHA1 | Date | |
|---|---|---|---|
|
6244161d6b | ||
|
|
d2d1604276 |
@ -9,6 +9,7 @@ import {
|
||||
import {
|
||||
extend,
|
||||
numericProp,
|
||||
preventDefault,
|
||||
makeStringProp,
|
||||
createNamespace,
|
||||
BORDER_SURROUND,
|
||||
@ -135,7 +136,7 @@ export default defineComponent({
|
||||
|
||||
const onClick = (event: MouseEvent) => {
|
||||
if (props.loading) {
|
||||
event.preventDefault();
|
||||
preventDefault(event);
|
||||
} else if (!props.disabled) {
|
||||
emit('click', event);
|
||||
route();
|
||||
|
||||
@ -12,6 +12,7 @@ import {
|
||||
isDef,
|
||||
truthProp,
|
||||
numericProp,
|
||||
windowHeight,
|
||||
makeStringProp,
|
||||
makeNumericProp,
|
||||
createNamespace,
|
||||
@ -86,7 +87,7 @@ export default defineComponent({
|
||||
if (props.direction === 'down') {
|
||||
offset.value = rect.bottom;
|
||||
} else {
|
||||
offset.value = window.innerHeight - rect.top;
|
||||
offset.value = windowHeight.value - rect.top;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@ -6,11 +6,11 @@ const renderStop = (color: string, offset: number, opacity?: number) => (
|
||||
export const Network = (
|
||||
<svg viewBox="0 0 160 160">
|
||||
<defs>
|
||||
<linearGradient id={`${prefix}1`} x1="64.022%" y1="100%" x2="64.022%">
|
||||
<linearGradient id={`${prefix}1`} x1="64%" y1="100%" x2="64%">
|
||||
{renderStop('#FFF', 0, 0.5)}
|
||||
{renderStop('#F2F3F5', 100)}
|
||||
</linearGradient>
|
||||
<linearGradient id={`${prefix}2`} x1="50%" x2="50%" y2="84.459%">
|
||||
<linearGradient id={`${prefix}2`} x1="50%" x2="50%" y2="84%">
|
||||
{renderStop('#EBEDF0', 0)}
|
||||
{renderStop('#DCDEE0', 100, 0)}
|
||||
</linearGradient>
|
||||
@ -18,18 +18,14 @@ export const Network = (
|
||||
{renderStop('#EAEDF0', 0)}
|
||||
{renderStop('#DCDEE0', 100)}
|
||||
</linearGradient>
|
||||
<linearGradient id={`${prefix}4`} x1="100%" y1="100%" x2="100%">
|
||||
{renderStop('#EAEDF0', 0)}
|
||||
{renderStop('#DCDEE0', 100)}
|
||||
</linearGradient>
|
||||
<radialGradient
|
||||
id={`${prefix}5`}
|
||||
id={`${prefix}4`}
|
||||
cx="50%"
|
||||
cy="0%"
|
||||
fx="50%"
|
||||
fy="0%"
|
||||
r="100%"
|
||||
gradientTransform="matrix(0 1 -.54835 0 .5 -.5)"
|
||||
gradientTransform="matrix(0 1 -.54 0 .5 -.5)"
|
||||
>
|
||||
{renderStop('#EBEDF0', 0)}
|
||||
{renderStop('#FFF', 100, 0)}
|
||||
@ -37,49 +33,30 @@ export const Network = (
|
||||
</defs>
|
||||
<g fill="none">
|
||||
<g opacity=".8">
|
||||
<path
|
||||
d="M0 124V46h20v20h14v58H0z"
|
||||
fill={`url(#${prefix}1)`}
|
||||
transform="matrix(-1 0 0 1 36 7)"
|
||||
/>
|
||||
<path
|
||||
d="M121 8h22.231v14H152v77.37h-31V8z"
|
||||
fill={`url(#${prefix}1)`}
|
||||
transform="translate(2 7)"
|
||||
/>
|
||||
<path d="M36 131V53H16v20H2v58h34z" fill={`url(#${prefix}1)`} />
|
||||
<path d="M123 15h22v14h9v77h-31V15z" fill={`url(#${prefix}1)`} />
|
||||
</g>
|
||||
<path fill={`url(#${prefix}5)`} d="M0 139h160v21H0z" />
|
||||
<path fill={`url(#${prefix}4)`} d="M0 139h160v21H0z" />
|
||||
<path
|
||||
d="M37 18a7 7 0 013 13.326v26.742c0 1.23-.997 2.227-2.227 2.227h-1.546A2.227 2.227 0 0134 58.068V31.326A7 7 0 0137 18z"
|
||||
d="M80 54a7 7 0 0 1 3 13v27l-2 2h-2a2 2 0 0 1-2-2V67a7 7 0 0 1 3-13z"
|
||||
fill={`url(#${prefix}2)`}
|
||||
transform="translate(43 36)"
|
||||
/>
|
||||
<g opacity=".6" stroke-linecap="round" stroke-width="7">
|
||||
<path
|
||||
d="M20.875 11.136a18.868 18.868 0 00-5.284 13.121c0 5.094 2.012 9.718 5.284 13.12"
|
||||
d="M64 47a19 19 0 0 0-5 13c0 5 2 10 5 13"
|
||||
stroke={`url(#${prefix}3)`}
|
||||
transform="translate(43 36)"
|
||||
/>
|
||||
<path d="M53 36a34 34 0 0 0 0 48" stroke={`url(#${prefix}3)`} />
|
||||
<path
|
||||
d="M9.849 0C3.756 6.225 0 14.747 0 24.146c0 9.398 3.756 17.92 9.849 24.145"
|
||||
d="M95 73a19 19 0 0 0 6-13c0-5-2-9-6-13"
|
||||
stroke={`url(#${prefix}3)`}
|
||||
transform="translate(43 36)"
|
||||
/>
|
||||
<path
|
||||
d="M57.625 11.136a18.868 18.868 0 00-5.284 13.121c0 5.094 2.012 9.718 5.284 13.12"
|
||||
stroke={`url(#${prefix}4)`}
|
||||
transform="rotate(-180 76.483 42.257)"
|
||||
/>
|
||||
<path
|
||||
d="M73.216 0c-6.093 6.225-9.849 14.747-9.849 24.146 0 9.398 3.756 17.92 9.849 24.145"
|
||||
stroke={`url(#${prefix}4)`}
|
||||
transform="rotate(-180 89.791 42.146)"
|
||||
/>
|
||||
<path d="M106 84a34 34 0 0 0 0-48" stroke={`url(#${prefix}3)`} />
|
||||
</g>
|
||||
<g transform="translate(31 105)">
|
||||
<rect fill="#EBEDF0" width="98" height="34" rx="2" />
|
||||
<rect fill="#FFF" x="9" y="8" width="80" height="18" rx="1.114" />
|
||||
<rect fill="#EBEDF0" x="15" y="12" width="18" height="6" rx="1.114" />
|
||||
<rect fill="#FFF" x="9" y="8" width="80" height="18" rx="1.1" />
|
||||
<rect fill="#EBEDF0" x="15" y="12" width="18" height="6" rx="1.1" />
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
||||
@ -36,9 +36,9 @@ exports[`should render svg when image is network 1`] = `
|
||||
<svg viewbox="0 0 160 160">
|
||||
<defs>
|
||||
<linearGradient id="van-empty-network-1"
|
||||
x1="64.022%"
|
||||
x1="64%"
|
||||
y1="100%"
|
||||
x2="64.022%"
|
||||
x2="64%"
|
||||
>
|
||||
<stop stop-color="#FFF"
|
||||
offset="0%"
|
||||
@ -53,7 +53,7 @@ exports[`should render svg when image is network 1`] = `
|
||||
<linearGradient id="van-empty-network-2"
|
||||
x1="50%"
|
||||
x2="50%"
|
||||
y2="84.459%"
|
||||
y2="84%"
|
||||
>
|
||||
<stop stop-color="#EBEDF0"
|
||||
offset="0%"
|
||||
@ -79,27 +79,13 @@ exports[`should render svg when image is network 1`] = `
|
||||
>
|
||||
</stop>
|
||||
</linearGradient>
|
||||
<linearGradient id="van-empty-network-4"
|
||||
x1="100%"
|
||||
y1="100%"
|
||||
x2="100%"
|
||||
>
|
||||
<stop stop-color="#EAEDF0"
|
||||
offset="0%"
|
||||
>
|
||||
</stop>
|
||||
<stop stop-color="#DCDEE0"
|
||||
offset="100%"
|
||||
>
|
||||
</stop>
|
||||
</linearGradient>
|
||||
<radialGradient id="van-empty-network-5"
|
||||
<radialGradient id="van-empty-network-4"
|
||||
cx="50%"
|
||||
cy="0%"
|
||||
fx="50%"
|
||||
fy="0%"
|
||||
r="100%"
|
||||
gradienttransform="matrix(0 1 -.54835 0 .5 -.5)"
|
||||
gradienttransform="matrix(0 1 -.54 0 .5 -.5)"
|
||||
>
|
||||
<stop stop-color="#EBEDF0"
|
||||
offset="0%"
|
||||
@ -114,48 +100,41 @@ exports[`should render svg when image is network 1`] = `
|
||||
</defs>
|
||||
<g fill="none">
|
||||
<g opacity=".8">
|
||||
<path d="M0 124V46h20v20h14v58H0z"
|
||||
<path d="M36 131V53H16v20H2v58h34z"
|
||||
fill="url(#van-empty-network-1)"
|
||||
transform="matrix(-1 0 0 1 36 7)"
|
||||
>
|
||||
</path>
|
||||
<path d="M121 8h22.231v14H152v77.37h-31V8z"
|
||||
<path d="M123 15h22v14h9v77h-31V15z"
|
||||
fill="url(#van-empty-network-1)"
|
||||
transform="translate(2 7)"
|
||||
>
|
||||
</path>
|
||||
</g>
|
||||
<path fill="url(#van-empty-network-5)"
|
||||
<path fill="url(#van-empty-network-4)"
|
||||
d="M0 139h160v21H0z"
|
||||
>
|
||||
</path>
|
||||
<path d="M37 18a7 7 0 013 13.326v26.742c0 1.23-.997 2.227-2.227 2.227h-1.546A2.227 2.227 0 0134 58.068V31.326A7 7 0 0137 18z"
|
||||
<path d="M80 54a7 7 0 0 1 3 13v27l-2 2h-2a2 2 0 0 1-2-2V67a7 7 0 0 1 3-13z"
|
||||
fill="url(#van-empty-network-2)"
|
||||
transform="translate(43 36)"
|
||||
>
|
||||
</path>
|
||||
<g opacity=".6"
|
||||
stroke-linecap="round"
|
||||
stroke-width="7"
|
||||
>
|
||||
<path d="M20.875 11.136a18.868 18.868 0 00-5.284 13.121c0 5.094 2.012 9.718 5.284 13.12"
|
||||
<path d="M64 47a19 19 0 0 0-5 13c0 5 2 10 5 13"
|
||||
stroke="url(#van-empty-network-3)"
|
||||
transform="translate(43 36)"
|
||||
>
|
||||
</path>
|
||||
<path d="M9.849 0C3.756 6.225 0 14.747 0 24.146c0 9.398 3.756 17.92 9.849 24.145"
|
||||
<path d="M53 36a34 34 0 0 0 0 48"
|
||||
stroke="url(#van-empty-network-3)"
|
||||
transform="translate(43 36)"
|
||||
>
|
||||
</path>
|
||||
<path d="M57.625 11.136a18.868 18.868 0 00-5.284 13.121c0 5.094 2.012 9.718 5.284 13.12"
|
||||
stroke="url(#van-empty-network-4)"
|
||||
transform="rotate(-180 76.483 42.257)"
|
||||
<path d="M95 73a19 19 0 0 0 6-13c0-5-2-9-6-13"
|
||||
stroke="url(#van-empty-network-3)"
|
||||
>
|
||||
</path>
|
||||
<path d="M73.216 0c-6.093 6.225-9.849 14.747-9.849 24.146 0 9.398 3.756 17.92 9.849 24.145"
|
||||
stroke="url(#van-empty-network-4)"
|
||||
transform="rotate(-180 89.791 42.146)"
|
||||
<path d="M106 84a34 34 0 0 0 0-48"
|
||||
stroke="url(#van-empty-network-3)"
|
||||
>
|
||||
</path>
|
||||
</g>
|
||||
@ -171,7 +150,7 @@ exports[`should render svg when image is network 1`] = `
|
||||
y="8"
|
||||
width="80"
|
||||
height="18"
|
||||
rx="1.114"
|
||||
rx="1.1"
|
||||
>
|
||||
</rect>
|
||||
<rect fill="#EBEDF0"
|
||||
@ -179,7 +158,7 @@ exports[`should render svg when image is network 1`] = `
|
||||
y="12"
|
||||
width="18"
|
||||
height="6"
|
||||
rx="1.114"
|
||||
rx="1.1"
|
||||
>
|
||||
</rect>
|
||||
</g>
|
||||
|
||||
@ -5,6 +5,7 @@ import {
|
||||
FORM_KEY,
|
||||
truthProp,
|
||||
numericProp,
|
||||
preventDefault,
|
||||
makeStringProp,
|
||||
createNamespace,
|
||||
} from '../utils';
|
||||
@ -170,7 +171,7 @@ export default defineComponent({
|
||||
};
|
||||
|
||||
const onSubmit = (event: Event) => {
|
||||
event.preventDefault();
|
||||
preventDefault(event);
|
||||
submit();
|
||||
};
|
||||
|
||||
|
||||
@ -16,6 +16,8 @@ import {
|
||||
truthProp,
|
||||
unknownProp,
|
||||
Interceptor,
|
||||
windowWidth,
|
||||
windowHeight,
|
||||
makeArrayProp,
|
||||
makeStringProp,
|
||||
makeNumericProp,
|
||||
@ -25,7 +27,7 @@ import {
|
||||
} from '../utils';
|
||||
|
||||
// Composables
|
||||
import { useRect, useWindowSize } from '@vant/use';
|
||||
import { useRect } from '@vant/use';
|
||||
import { useExpose } from '../composables/use-expose';
|
||||
|
||||
// Components
|
||||
@ -78,7 +80,6 @@ export default defineComponent({
|
||||
|
||||
setup(props, { emit, slots }) {
|
||||
const swipeRef = ref<SwipeInstance>();
|
||||
const windowSize = useWindowSize();
|
||||
|
||||
const state = reactive({
|
||||
active: 0,
|
||||
@ -185,7 +186,7 @@ export default defineComponent({
|
||||
|
||||
onMounted(resize);
|
||||
|
||||
watch([windowSize.width, windowSize.height], resize);
|
||||
watch([windowWidth, windowHeight], resize);
|
||||
|
||||
watch(
|
||||
() => props.startPosition,
|
||||
|
||||
@ -14,7 +14,7 @@ class LazyContainer {
|
||||
this.options = {};
|
||||
this.lazy = lazy;
|
||||
|
||||
this._queue = [];
|
||||
this.queue = [];
|
||||
this.update({ el, binding });
|
||||
}
|
||||
|
||||
@ -61,7 +61,7 @@ class LazyContainer {
|
||||
export default class LazyContainerManager {
|
||||
constructor({ lazy }) {
|
||||
this.lazy = lazy;
|
||||
this._queue = [];
|
||||
this.queue = [];
|
||||
}
|
||||
|
||||
bind(el, binding, vnode) {
|
||||
@ -71,19 +71,19 @@ export default class LazyContainerManager {
|
||||
vnode,
|
||||
lazy: this.lazy,
|
||||
});
|
||||
this._queue.push(container);
|
||||
this.queue.push(container);
|
||||
}
|
||||
|
||||
update(el, binding, vnode) {
|
||||
const container = this._queue.find((item) => item.el === el);
|
||||
const container = this.queue.find((item) => item.el === el);
|
||||
if (!container) return;
|
||||
container.update({ el, binding, vnode });
|
||||
}
|
||||
|
||||
unbind(el) {
|
||||
const container = this._queue.find((item) => item.el === el);
|
||||
const container = this.queue.find((item) => item.el === el);
|
||||
if (!container) return;
|
||||
container.clear();
|
||||
remove(this._queue, container);
|
||||
remove(this.queue, container);
|
||||
}
|
||||
}
|
||||
|
||||
@ -59,7 +59,7 @@ export default (lazyManager) => ({
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
const { src, loading, error } = lazyManager._valueFormatter(this.src);
|
||||
const { src, loading, error } = lazyManager.valueFormatter(this.src);
|
||||
this.state.loaded = false;
|
||||
this.options.src = src;
|
||||
this.options.error = error;
|
||||
|
||||
@ -50,9 +50,9 @@ export default function () {
|
||||
observerOptions,
|
||||
}) {
|
||||
this.mode = modeType.event;
|
||||
this.ListenerQueue = [];
|
||||
this.TargetIndex = 0;
|
||||
this.TargetQueue = [];
|
||||
this.listeners = [];
|
||||
this.targetIndex = 0;
|
||||
this.targets = [];
|
||||
this.options = {
|
||||
silent,
|
||||
dispatchEvent: !!dispatchEvent,
|
||||
@ -70,10 +70,10 @@ export default function () {
|
||||
observer: !!observer,
|
||||
observerOptions: observerOptions || DEFAULT_OBSERVER_OPTIONS,
|
||||
};
|
||||
this._initEvent();
|
||||
this._imageCache = new ImageCache({ max: 200 });
|
||||
this.initEvent();
|
||||
this.imageCache = new ImageCache({ max: 200 });
|
||||
this.lazyLoadHandler = throttle(
|
||||
this._lazyLoadHandler.bind(this),
|
||||
this.lazyLoadHandler.bind(this),
|
||||
this.options.throttleWait
|
||||
);
|
||||
|
||||
@ -94,7 +94,7 @@ export default function () {
|
||||
* @return {Array}
|
||||
*/
|
||||
performance() {
|
||||
return this.ListenerQueue.map((item) => item.performance());
|
||||
return this.listeners.map((item) => item.performance());
|
||||
}
|
||||
|
||||
/*
|
||||
@ -103,12 +103,12 @@ export default function () {
|
||||
* @return
|
||||
*/
|
||||
addLazyBox(vm) {
|
||||
this.ListenerQueue.push(vm);
|
||||
this.listeners.push(vm);
|
||||
if (inBrowser) {
|
||||
this._addListenerTarget(window);
|
||||
this._observer && this._observer.observe(vm.el);
|
||||
this.addListenerTarget(window);
|
||||
this.observer && this.observer.observe(vm.el);
|
||||
if (vm.$el && vm.$el.parentNode) {
|
||||
this._addListenerTarget(vm.$el.parentNode);
|
||||
this.addListenerTarget(vm.$el.parentNode);
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -121,17 +121,17 @@ export default function () {
|
||||
* @return
|
||||
*/
|
||||
add(el, binding, vnode) {
|
||||
if (this.ListenerQueue.some((item) => item.el === el)) {
|
||||
if (this.listeners.some((item) => item.el === el)) {
|
||||
this.update(el, binding);
|
||||
return nextTick(this.lazyLoadHandler);
|
||||
}
|
||||
|
||||
const value = this._valueFormatter(binding.value);
|
||||
const value = this.valueFormatter(binding.value);
|
||||
let { src } = value;
|
||||
|
||||
nextTick(() => {
|
||||
src = getBestSelectionFromSrcset(el, this.options.scale) || src;
|
||||
this._observer && this._observer.observe(el);
|
||||
this.observer && this.observer.observe(el);
|
||||
|
||||
const container = Object.keys(binding.modifiers)[0];
|
||||
let $parent;
|
||||
@ -156,16 +156,16 @@ export default function () {
|
||||
loading: value.loading,
|
||||
error: value.error,
|
||||
cors: value.cors,
|
||||
elRenderer: this._elRenderer.bind(this),
|
||||
elRenderer: this.elRenderer.bind(this),
|
||||
options: this.options,
|
||||
imageCache: this._imageCache,
|
||||
imageCache: this.imageCache,
|
||||
});
|
||||
|
||||
this.ListenerQueue.push(newListener);
|
||||
this.listeners.push(newListener);
|
||||
|
||||
if (inBrowser) {
|
||||
this._addListenerTarget(window);
|
||||
this._addListenerTarget($parent);
|
||||
this.addListenerTarget(window);
|
||||
this.addListenerTarget($parent);
|
||||
}
|
||||
|
||||
this.lazyLoadHandler();
|
||||
@ -180,11 +180,11 @@ export default function () {
|
||||
* @return
|
||||
*/
|
||||
update(el, binding, vnode) {
|
||||
const value = this._valueFormatter(binding.value);
|
||||
const value = this.valueFormatter(binding.value);
|
||||
let { src } = value;
|
||||
src = getBestSelectionFromSrcset(el, this.options.scale) || src;
|
||||
|
||||
const exist = this.ListenerQueue.find((item) => item.el === el);
|
||||
const exist = this.listeners.find((item) => item.el === el);
|
||||
if (!exist) {
|
||||
this.add(el, binding, vnode);
|
||||
} else {
|
||||
@ -194,9 +194,9 @@ export default function () {
|
||||
loading: value.loading,
|
||||
});
|
||||
}
|
||||
if (this._observer) {
|
||||
this._observer.unobserve(el);
|
||||
this._observer.observe(el);
|
||||
if (this.observer) {
|
||||
this.observer.unobserve(el);
|
||||
this.observer.observe(el);
|
||||
}
|
||||
this.lazyLoadHandler();
|
||||
nextTick(() => this.lazyLoadHandler());
|
||||
@ -209,12 +209,12 @@ export default function () {
|
||||
*/
|
||||
remove(el) {
|
||||
if (!el) return;
|
||||
this._observer && this._observer.unobserve(el);
|
||||
const existItem = this.ListenerQueue.find((item) => item.el === el);
|
||||
this.observer && this.observer.unobserve(el);
|
||||
const existItem = this.listeners.find((item) => item.el === el);
|
||||
if (existItem) {
|
||||
this._removeListenerTarget(existItem.$parent);
|
||||
this._removeListenerTarget(window);
|
||||
remove(this.ListenerQueue, existItem);
|
||||
this.removeListenerTarget(existItem.$parent);
|
||||
this.removeListenerTarget(window);
|
||||
remove(this.listeners, existItem);
|
||||
existItem.$destroy();
|
||||
}
|
||||
}
|
||||
@ -226,12 +226,12 @@ export default function () {
|
||||
*/
|
||||
removeComponent(vm) {
|
||||
if (!vm) return;
|
||||
remove(this.ListenerQueue, vm);
|
||||
this._observer && this._observer.unobserve(vm.el);
|
||||
remove(this.listeners, vm);
|
||||
this.observer && this.observer.unobserve(vm.el);
|
||||
if (vm.$parent && vm.$el.parentNode) {
|
||||
this._removeListenerTarget(vm.$el.parentNode);
|
||||
this.removeListenerTarget(vm.$el.parentNode);
|
||||
}
|
||||
this._removeListenerTarget(window);
|
||||
this.removeListenerTarget(window);
|
||||
}
|
||||
|
||||
setMode(mode) {
|
||||
@ -242,21 +242,21 @@ export default function () {
|
||||
this.mode = mode; // event or observer
|
||||
|
||||
if (mode === modeType.event) {
|
||||
if (this._observer) {
|
||||
this.ListenerQueue.forEach((listener) => {
|
||||
this._observer.unobserve(listener.el);
|
||||
if (this.observer) {
|
||||
this.listeners.forEach((listener) => {
|
||||
this.observer.unobserve(listener.el);
|
||||
});
|
||||
this._observer = null;
|
||||
this.observer = null;
|
||||
}
|
||||
|
||||
this.TargetQueue.forEach((target) => {
|
||||
this._initListen(target.el, true);
|
||||
this.targets.forEach((target) => {
|
||||
this.initListen(target.el, true);
|
||||
});
|
||||
} else {
|
||||
this.TargetQueue.forEach((target) => {
|
||||
this._initListen(target.el, false);
|
||||
this.targets.forEach((target) => {
|
||||
this.initListen(target.el, false);
|
||||
});
|
||||
this._initIntersectionObserver();
|
||||
this.initIntersectionObserver();
|
||||
}
|
||||
}
|
||||
|
||||
@ -269,22 +269,22 @@ export default function () {
|
||||
* @param {DOM} el listener target
|
||||
* @return
|
||||
*/
|
||||
_addListenerTarget(el) {
|
||||
addListenerTarget(el) {
|
||||
if (!el) return;
|
||||
let target = this.TargetQueue.find((target) => target.el === el);
|
||||
let target = this.targets.find((target) => target.el === el);
|
||||
if (!target) {
|
||||
target = {
|
||||
el,
|
||||
id: ++this.TargetIndex,
|
||||
id: ++this.targetIndex,
|
||||
childrenCount: 1,
|
||||
listened: true,
|
||||
};
|
||||
this.mode === modeType.event && this._initListen(target.el, true);
|
||||
this.TargetQueue.push(target);
|
||||
this.mode === modeType.event && this.initListen(target.el, true);
|
||||
this.targets.push(target);
|
||||
} else {
|
||||
target.childrenCount++;
|
||||
}
|
||||
return this.TargetIndex;
|
||||
return this.targetIndex;
|
||||
}
|
||||
|
||||
/*
|
||||
@ -292,13 +292,13 @@ export default function () {
|
||||
* @param {DOM} el or window
|
||||
* @return
|
||||
*/
|
||||
_removeListenerTarget(el) {
|
||||
this.TargetQueue.forEach((target, index) => {
|
||||
removeListenerTarget(el) {
|
||||
this.targets.forEach((target, index) => {
|
||||
if (target.el === el) {
|
||||
target.childrenCount--;
|
||||
if (!target.childrenCount) {
|
||||
this._initListen(target.el, false);
|
||||
this.TargetQueue.splice(index, 1);
|
||||
this.initListen(target.el, false);
|
||||
this.targets.splice(index, 1);
|
||||
target = null;
|
||||
}
|
||||
}
|
||||
@ -311,13 +311,13 @@ export default function () {
|
||||
* @param {boolean} start flag
|
||||
* @return
|
||||
*/
|
||||
_initListen(el, start) {
|
||||
initListen(el, start) {
|
||||
this.options.ListenEvents.forEach((evt) =>
|
||||
(start ? on : off)(el, evt, this.lazyLoadHandler)
|
||||
);
|
||||
}
|
||||
|
||||
_initEvent() {
|
||||
initEvent() {
|
||||
this.Event = {
|
||||
listeners: {
|
||||
loading: [],
|
||||
@ -358,9 +358,9 @@ export default function () {
|
||||
* find nodes which in viewport and trigger load
|
||||
* @return
|
||||
*/
|
||||
_lazyLoadHandler() {
|
||||
lazyLoadHandler() {
|
||||
const freeList = [];
|
||||
this.ListenerQueue.forEach((listener) => {
|
||||
this.listeners.forEach((listener) => {
|
||||
if (!listener.el || !listener.el.parentNode) {
|
||||
freeList.push(listener);
|
||||
}
|
||||
@ -369,7 +369,7 @@ export default function () {
|
||||
listener.load();
|
||||
});
|
||||
freeList.forEach((item) => {
|
||||
remove(this.ListenerQueue, item);
|
||||
remove(this.listeners, item);
|
||||
item.$destroy();
|
||||
});
|
||||
}
|
||||
@ -379,19 +379,19 @@ export default function () {
|
||||
* set mode to observer
|
||||
* @return
|
||||
*/
|
||||
_initIntersectionObserver() {
|
||||
initIntersectionObserver() {
|
||||
if (!hasIntersectionObserver) {
|
||||
return;
|
||||
}
|
||||
|
||||
this._observer = new IntersectionObserver(
|
||||
this._observerHandler.bind(this),
|
||||
this.observer = new IntersectionObserver(
|
||||
this.observerHandler.bind(this),
|
||||
this.options.observerOptions
|
||||
);
|
||||
|
||||
if (this.ListenerQueue.length) {
|
||||
this.ListenerQueue.forEach((listener) => {
|
||||
this._observer.observe(listener.el);
|
||||
if (this.listeners.length) {
|
||||
this.listeners.forEach((listener) => {
|
||||
this.observer.observe(listener.el);
|
||||
});
|
||||
}
|
||||
}
|
||||
@ -400,13 +400,13 @@ export default function () {
|
||||
* init IntersectionObserver
|
||||
* @return
|
||||
*/
|
||||
_observerHandler(entries) {
|
||||
observerHandler(entries) {
|
||||
entries.forEach((entry) => {
|
||||
if (entry.isIntersecting) {
|
||||
this.ListenerQueue.forEach((listener) => {
|
||||
this.listeners.forEach((listener) => {
|
||||
if (listener.el === entry.target) {
|
||||
if (listener.state.loaded)
|
||||
return this._observer.unobserve(listener.el);
|
||||
return this.observer.unobserve(listener.el);
|
||||
listener.load();
|
||||
}
|
||||
});
|
||||
@ -421,7 +421,7 @@ export default function () {
|
||||
* @param {bool} inCache is rendered from cache
|
||||
* @return
|
||||
*/
|
||||
_elRenderer(listener, state, cache) {
|
||||
elRenderer(listener, state, cache) {
|
||||
if (!listener.el) return;
|
||||
const { el, bindType } = listener;
|
||||
|
||||
@ -463,7 +463,7 @@ export default function () {
|
||||
* @param {string} image's src
|
||||
* @return {object} image's loading, loaded, error url
|
||||
*/
|
||||
_valueFormatter(value) {
|
||||
valueFormatter(value) {
|
||||
let src = value;
|
||||
let { loading, error } = this.options;
|
||||
|
||||
|
||||
@ -30,7 +30,7 @@ export default class ReactiveListener {
|
||||
|
||||
this.$parent = $parent;
|
||||
this.elRenderer = elRenderer;
|
||||
this._imageCache = imageCache;
|
||||
this.imageCache = imageCache;
|
||||
this.performanceData = {
|
||||
loadStart: 0,
|
||||
loadEnd: 0,
|
||||
@ -156,7 +156,7 @@ export default class ReactiveListener {
|
||||
return;
|
||||
}
|
||||
if (this.state.rendered && this.state.loaded) return;
|
||||
if (this._imageCache.has(this.src)) {
|
||||
if (this.imageCache.has(this.src)) {
|
||||
this.state.loaded = true;
|
||||
this.render('loaded', true);
|
||||
this.state.rendered = true;
|
||||
@ -182,7 +182,7 @@ export default class ReactiveListener {
|
||||
this.record('loadEnd');
|
||||
this.render('loaded', false);
|
||||
this.state.rendered = true;
|
||||
this._imageCache.add(this.src);
|
||||
this.imageCache.add(this.src);
|
||||
onFinish();
|
||||
},
|
||||
(err) => {
|
||||
|
||||
@ -139,8 +139,7 @@ export const loadImageAsync = (item, resolve, reject) => {
|
||||
const image = new Image();
|
||||
|
||||
if (!item || !item.src) {
|
||||
const err = new Error('image src is required');
|
||||
return reject(err);
|
||||
return reject(new Error('image src is required'));
|
||||
}
|
||||
|
||||
image.src = item.src;
|
||||
@ -163,22 +162,22 @@ export class ImageCache {
|
||||
this.options = {
|
||||
max: max || 100,
|
||||
};
|
||||
this._caches = [];
|
||||
this.caches = [];
|
||||
}
|
||||
|
||||
has(key) {
|
||||
return this._caches.indexOf(key) > -1;
|
||||
return this.caches.indexOf(key) > -1;
|
||||
}
|
||||
|
||||
add(key) {
|
||||
if (this.has(key)) return;
|
||||
this._caches.push(key);
|
||||
if (this._caches.length > this.options.max) {
|
||||
this.caches.push(key);
|
||||
if (this.caches.length > this.options.max) {
|
||||
this.free();
|
||||
}
|
||||
}
|
||||
|
||||
free() {
|
||||
this._caches.shift();
|
||||
this.caches.shift();
|
||||
}
|
||||
}
|
||||
|
||||
@ -139,10 +139,7 @@ export default defineComponent({
|
||||
}
|
||||
};
|
||||
|
||||
watch(
|
||||
[() => props.loading, () => props.finished, () => props.error],
|
||||
check
|
||||
);
|
||||
watch(() => [props.loading, props.finished, props.error], check);
|
||||
|
||||
if (tabStatus) {
|
||||
watch(tabStatus, (tabActive) => {
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import { ref, PropType, defineComponent } from 'vue';
|
||||
import { numericProp, createNamespace } from '../utils';
|
||||
import { numericProp, createNamespace, preventDefault } from '../utils';
|
||||
import { useTouch } from '../composables/use-touch';
|
||||
import { Loading } from '../loading';
|
||||
|
||||
@ -8,7 +8,7 @@ const [name, bem] = createNamespace('key');
|
||||
const CollapseIcon = (
|
||||
<svg class={bem('collapse-icon')} viewBox="0 0 30 24">
|
||||
<path
|
||||
d="M25.877 12.843h-1.502c-.188 0-.188 0-.188.19v1.512c0 .188 0 .188.188.188h1.5c.187 0 .187 0 .187-.188v-1.511c0-.19 0-.191-.185-.191zM17.999 10.2c0 .188 0 .188.188.188h1.687c.188 0 .188 0 .188-.188V8.688c0-.187.004-.187-.186-.19h-1.69c-.187 0-.187 0-.187.19V10.2zm2.25-3.967h1.5c.188 0 .188 0 .188-.188v-1.7c0-.19 0-.19-.188-.19h-1.5c-.189 0-.189 0-.189.19v1.7c0 .188 0 .188.19.188zm2.063 4.157h3.563c.187 0 .187 0 .187-.189V4.346c0-.19.004-.19-.185-.19h-1.69c-.187 0-.187 0-.187.188v4.155h-1.688c-.187 0-.187 0-.187.189v1.514c0 .19 0 .19.187.19zM14.812 24l2.812-3.4H12l2.813 3.4zm-9-11.157H4.31c-.188 0-.188 0-.188.19v1.512c0 .188 0 .188.188.188h1.502c.187 0 .187 0 .187-.188v-1.511c0-.19.01-.191-.189-.191zm15.937 0H8.25c-.188 0-.188 0-.188.19v1.512c0 .188 0 .188.188.188h13.5c.188 0 .188 0 .188-.188v-1.511c0-.19 0-.191-.188-.191zm-11.438-2.454h1.5c.188 0 .188 0 .188-.188V8.688c0-.187 0-.187-.188-.189h-1.5c-.187 0-.187 0-.187.189V10.2c0 .188 0 .188.187.188zM27.94 0c.563 0 .917.21 1.313.567.518.466.748.757.748 1.51v14.92c0 .567-.188 1.134-.562 1.512-.376.378-.938.566-1.313.566H2.063c-.563 0-.938-.188-1.313-.566-.562-.378-.75-.945-.75-1.511V2.078C0 1.51.188.944.562.567.938.189 1.5 0 1.875 0zm-.062 2H2v14.92h25.877V2zM5.81 4.157c.19 0 .19 0 .19.189v1.762c-.003.126-.024.126-.188.126H4.249c-.126-.003-.126-.023-.126-.188v-1.7c-.187-.19 0-.19.188-.19zm10.5 2.077h1.503c.187 0 .187 0 .187-.188v-1.7c0-.19 0-.19-.187-.19h-1.502c-.188 0-.188.001-.188.19v1.7c0 .188 0 .188.188.188zM7.875 8.5c.187 0 .187.002.187.189V10.2c0 .188 0 .188-.187.188H4.249c-.126-.002-.126-.023-.126-.188V8.625c.003-.126.024-.126.188-.126zm7.875 0c.19.002.19.002.19.189v1.575c-.003.126-.024.126-.19.126h-1.563c-.126-.002-.126-.023-.126-.188V8.625c.002-.126.023-.126.189-.126zm-6-4.342c.187 0 .187 0 .187.189v1.7c0 .188 0 .188-.187.188H8.187c-.126-.003-.126-.023-.126-.188V4.283c.003-.126.024-.126.188-.126zm3.94 0c.185 0 .372 0 .372.189v1.762c-.002.126-.023.126-.187.126h-1.75C12 6.231 12 6.211 12 6.046v-1.7c0-.19.187-.19.187-.19z"
|
||||
d="M26 13h-2v2h2v-2zm-8-3h2V8h-2v2zm2-4h2V4h-2v2zm2 4h4V4h-2v4h-2v2zm-7 14 3-3h-6l3 3zM6 13H4v2h2v-2zm16 0H8v2h14v-2zm-12-3h2V8h-2v2zM28 0l1 1 1 1v15l-1 2H1l-1-2V2l1-1 1-1zm0 2H2v15h26V2zM6 4v2H4V4zm10 2h2V4h-2v2zM8 9v1H4V8zm8 0v1h-2V8zm-6-5v2H8V4zm4 0v2h-2V4z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
</svg>
|
||||
@ -17,7 +17,7 @@ const CollapseIcon = (
|
||||
const DeleteIcon = (
|
||||
<svg class={bem('delete-icon')} viewBox="0 0 32 22">
|
||||
<path
|
||||
d="M28.016 0A3.991 3.991 0 0132 3.987v14.026c0 2.2-1.787 3.987-3.98 3.987H10.382c-.509 0-.996-.206-1.374-.585L.89 13.09C.33 12.62 0 11.84 0 11.006c0-.86.325-1.62.887-2.08L9.01.585A1.936 1.936 0 0110.383 0zm0 1.947H10.368L2.24 10.28c-.224.226-.312.432-.312.73 0 .287.094.51.312.729l8.128 8.333h17.648a2.041 2.041 0 002.037-2.04V3.987c0-1.127-.915-2.04-2.037-2.04zM23.028 6a.96.96 0 01.678.292.95.95 0 01-.003 1.377l-3.342 3.348 3.326 3.333c.189.188.292.43.292.679 0 .248-.103.49-.292.679a.96.96 0 01-.678.292.959.959 0 01-.677-.292L18.99 12.36l-3.343 3.345a.96.96 0 01-.677.292.96.96 0 01-.678-.292.962.962 0 01-.292-.68c0-.248.104-.49.292-.679l3.342-3.348-3.342-3.348A.963.963 0 0114 6.971c0-.248.104-.49.292-.679A.96.96 0 0114.97 6a.96.96 0 01.677.292l3.358 3.348 3.345-3.348A.96.96 0 0123.028 6z"
|
||||
d="M28 0a4 4 0 0 1 4 4v14a4 4 0 0 1-4 4H10.4a2 2 0 0 1-1.4-.6L1 13.1c-.6-.5-.9-1.3-.9-2 0-1 .3-1.7.9-2.2L9 .6a2 2 0 0 1 1.4-.6zm0 2H10.4l-8.2 8.3a1 1 0 0 0-.3.7c0 .3.1.5.3.7l8.2 8.4H28a2 2 0 0 0 2-2V4c0-1.1-.9-2-2-2zm-5 4a1 1 0 0 1 .7.3 1 1 0 0 1 0 1.4L20.4 11l3.3 3.3c.2.2.3.5.3.7 0 .3-.1.5-.3.7a1 1 0 0 1-.7.3 1 1 0 0 1-.7-.3L19 12.4l-3.4 3.3a1 1 0 0 1-.6.3 1 1 0 0 1-.7-.3 1 1 0 0 1-.3-.7c0-.2.1-.5.3-.7l3.3-3.3-3.3-3.3A1 1 0 0 1 14 7c0-.3.1-.5.3-.7A1 1 0 0 1 15 6a1 1 0 0 1 .6.3L19 9.6l3.3-3.3A1 1 0 0 1 23 6z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
</svg>
|
||||
@ -61,7 +61,7 @@ export default defineComponent({
|
||||
// eliminate tap delay on safari
|
||||
// see: https://github.com/youzan/vant/issues/6836
|
||||
if (!slots.default) {
|
||||
event.preventDefault();
|
||||
preventDefault(event);
|
||||
}
|
||||
active.value = false;
|
||||
emit('press', props.text, props.type);
|
||||
|
||||
@ -178,7 +178,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<svg class="van-key__collapse-icon"
|
||||
viewbox="0 0 30 24"
|
||||
>
|
||||
<path d="M25.877 12.843h-1.502c-.188 0-.188 0-.188.19v1.512c0 .188 0 .188.188.188h1.5c.187 0 .187 0 .187-.188v-1.511c0-.19 0-.191-.185-.191zM17.999 10.2c0 .188 0 .188.188.188h1.687c.188 0 .188 0 .188-.188V8.688c0-.187.004-.187-.186-.19h-1.69c-.187 0-.187 0-.187.19V10.2zm2.25-3.967h1.5c.188 0 .188 0 .188-.188v-1.7c0-.19 0-.19-.188-.19h-1.5c-.189 0-.189 0-.189.19v1.7c0 .188 0 .188.19.188zm2.063 4.157h3.563c.187 0 .187 0 .187-.189V4.346c0-.19.004-.19-.185-.19h-1.69c-.187 0-.187 0-.187.188v4.155h-1.688c-.187 0-.187 0-.187.189v1.514c0 .19 0 .19.187.19zM14.812 24l2.812-3.4H12l2.813 3.4zm-9-11.157H4.31c-.188 0-.188 0-.188.19v1.512c0 .188 0 .188.188.188h1.502c.187 0 .187 0 .187-.188v-1.511c0-.19.01-.191-.189-.191zm15.937 0H8.25c-.188 0-.188 0-.188.19v1.512c0 .188 0 .188.188.188h13.5c.188 0 .188 0 .188-.188v-1.511c0-.19 0-.191-.188-.191zm-11.438-2.454h1.5c.188 0 .188 0 .188-.188V8.688c0-.187 0-.187-.188-.189h-1.5c-.187 0-.187 0-.187.189V10.2c0 .188 0 .188.187.188zM27.94 0c.563 0 .917.21 1.313.567.518.466.748.757.748 1.51v14.92c0 .567-.188 1.134-.562 1.512-.376.378-.938.566-1.313.566H2.063c-.563 0-.938-.188-1.313-.566-.562-.378-.75-.945-.75-1.511V2.078C0 1.51.188.944.562.567.938.189 1.5 0 1.875 0zm-.062 2H2v14.92h25.877V2zM5.81 4.157c.19 0 .19 0 .19.189v1.762c-.003.126-.024.126-.188.126H4.249c-.126-.003-.126-.023-.126-.188v-1.7c-.187-.19 0-.19.188-.19zm10.5 2.077h1.503c.187 0 .187 0 .187-.188v-1.7c0-.19 0-.19-.187-.19h-1.502c-.188 0-.188.001-.188.19v1.7c0 .188 0 .188.188.188zM7.875 8.5c.187 0 .187.002.187.189V10.2c0 .188 0 .188-.187.188H4.249c-.126-.002-.126-.023-.126-.188V8.625c.003-.126.024-.126.188-.126zm7.875 0c.19.002.19.002.19.189v1.575c-.003.126-.024.126-.19.126h-1.563c-.126-.002-.126-.023-.126-.188V8.625c.002-.126.023-.126.189-.126zm-6-4.342c.187 0 .187 0 .187.189v1.7c0 .188 0 .188-.187.188H8.187c-.126-.003-.126-.023-.126-.188V4.283c.003-.126.024-.126.188-.126zm3.94 0c.185 0 .372 0 .372.189v1.762c-.002.126-.023.126-.187.126h-1.75C12 6.231 12 6.211 12 6.046v-1.7c0-.19.187-.19.187-.19z"
|
||||
<path d="M26 13h-2v2h2v-2zm-8-3h2V8h-2v2zm2-4h2V4h-2v2zm2 4h4V4h-2v4h-2v2zm-7 14 3-3h-6l3 3zM6 13H4v2h2v-2zm16 0H8v2h14v-2zm-12-3h2V8h-2v2zM28 0l1 1 1 1v15l-1 2H1l-1-2V2l1-1 1-1zm0 2H2v15h26V2zM6 4v2H4V4zm10 2h2V4h-2v2zM8 9v1H4V8zm8 0v1h-2V8zm-6-5v2H8V4zm4 0v2h-2V4z"
|
||||
fill="currentColor"
|
||||
>
|
||||
</path>
|
||||
@ -201,7 +201,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<svg class="van-key__delete-icon"
|
||||
viewbox="0 0 32 22"
|
||||
>
|
||||
<path d="M28.016 0A3.991 3.991 0 0132 3.987v14.026c0 2.2-1.787 3.987-3.98 3.987H10.382c-.509 0-.996-.206-1.374-.585L.89 13.09C.33 12.62 0 11.84 0 11.006c0-.86.325-1.62.887-2.08L9.01.585A1.936 1.936 0 0110.383 0zm0 1.947H10.368L2.24 10.28c-.224.226-.312.432-.312.73 0 .287.094.51.312.729l8.128 8.333h17.648a2.041 2.041 0 002.037-2.04V3.987c0-1.127-.915-2.04-2.037-2.04zM23.028 6a.96.96 0 01.678.292.95.95 0 01-.003 1.377l-3.342 3.348 3.326 3.333c.189.188.292.43.292.679 0 .248-.103.49-.292.679a.96.96 0 01-.678.292.959.959 0 01-.677-.292L18.99 12.36l-3.343 3.345a.96.96 0 01-.677.292.96.96 0 01-.678-.292.962.962 0 01-.292-.68c0-.248.104-.49.292-.679l3.342-3.348-3.342-3.348A.963.963 0 0114 6.971c0-.248.104-.49.292-.679A.96.96 0 0114.97 6a.96.96 0 01.677.292l3.358 3.348 3.345-3.348A.96.96 0 0123.028 6z"
|
||||
<path d="M28 0a4 4 0 0 1 4 4v14a4 4 0 0 1-4 4H10.4a2 2 0 0 1-1.4-.6L1 13.1c-.6-.5-.9-1.3-.9-2 0-1 .3-1.7.9-2.2L9 .6a2 2 0 0 1 1.4-.6zm0 2H10.4l-8.2 8.3a1 1 0 0 0-.3.7c0 .3.1.5.3.7l8.2 8.4H28a2 2 0 0 0 2-2V4c0-1.1-.9-2-2-2zm-5 4a1 1 0 0 1 .7.3 1 1 0 0 1 0 1.4L20.4 11l3.3 3.3c.2.2.3.5.3.7 0 .3-.1.5-.3.7a1 1 0 0 1-.7.3 1 1 0 0 1-.7-.3L19 12.4l-3.4 3.3a1 1 0 0 1-.6.3 1 1 0 0 1-.7-.3 1 1 0 0 1-.3-.7c0-.2.1-.5.3-.7l3.3-3.3-3.3-3.3A1 1 0 0 1 14 7c0-.3.1-.5.3-.7A1 1 0 0 1 15 6a1 1 0 0 1 .6.3L19 9.6l3.3-3.3A1 1 0 0 1 23 6z"
|
||||
fill="currentColor"
|
||||
>
|
||||
</path>
|
||||
@ -316,7 +316,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<svg class="van-key__delete-icon"
|
||||
viewbox="0 0 32 22"
|
||||
>
|
||||
<path d="M28.016 0A3.991 3.991 0 0132 3.987v14.026c0 2.2-1.787 3.987-3.98 3.987H10.382c-.509 0-.996-.206-1.374-.585L.89 13.09C.33 12.62 0 11.84 0 11.006c0-.86.325-1.62.887-2.08L9.01.585A1.936 1.936 0 0110.383 0zm0 1.947H10.368L2.24 10.28c-.224.226-.312.432-.312.73 0 .287.094.51.312.729l8.128 8.333h17.648a2.041 2.041 0 002.037-2.04V3.987c0-1.127-.915-2.04-2.037-2.04zM23.028 6a.96.96 0 01.678.292.95.95 0 01-.003 1.377l-3.342 3.348 3.326 3.333c.189.188.292.43.292.679 0 .248-.103.49-.292.679a.96.96 0 01-.678.292.959.959 0 01-.677-.292L18.99 12.36l-3.343 3.345a.96.96 0 01-.677.292.96.96 0 01-.678-.292.962.962 0 01-.292-.68c0-.248.104-.49.292-.679l3.342-3.348-3.342-3.348A.963.963 0 0114 6.971c0-.248.104-.49.292-.679A.96.96 0 0114.97 6a.96.96 0 01.677.292l3.358 3.348 3.345-3.348A.96.96 0 0123.028 6z"
|
||||
<path d="M28 0a4 4 0 0 1 4 4v14a4 4 0 0 1-4 4H10.4a2 2 0 0 1-1.4-.6L1 13.1c-.6-.5-.9-1.3-.9-2 0-1 .3-1.7.9-2.2L9 .6a2 2 0 0 1 1.4-.6zm0 2H10.4l-8.2 8.3a1 1 0 0 0-.3.7c0 .3.1.5.3.7l8.2 8.4H28a2 2 0 0 0 2-2V4c0-1.1-.9-2-2-2zm-5 4a1 1 0 0 1 .7.3 1 1 0 0 1 0 1.4L20.4 11l3.3 3.3c.2.2.3.5.3.7 0 .3-.1.5-.3.7a1 1 0 0 1-.7.3 1 1 0 0 1-.7-.3L19 12.4l-3.4 3.3a1 1 0 0 1-.6.3 1 1 0 0 1-.7-.3 1 1 0 0 1-.3-.7c0-.2.1-.5.3-.7l3.3-3.3-3.3-3.3A1 1 0 0 1 14 7c0-.3.1-.5.3-.7A1 1 0 0 1 15 6a1 1 0 0 1 .6.3L19 9.6l3.3-3.3A1 1 0 0 1 23 6z"
|
||||
fill="currentColor"
|
||||
>
|
||||
</path>
|
||||
@ -444,7 +444,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<svg class="van-key__delete-icon"
|
||||
viewbox="0 0 32 22"
|
||||
>
|
||||
<path d="M28.016 0A3.991 3.991 0 0132 3.987v14.026c0 2.2-1.787 3.987-3.98 3.987H10.382c-.509 0-.996-.206-1.374-.585L.89 13.09C.33 12.62 0 11.84 0 11.006c0-.86.325-1.62.887-2.08L9.01.585A1.936 1.936 0 0110.383 0zm0 1.947H10.368L2.24 10.28c-.224.226-.312.432-.312.73 0 .287.094.51.312.729l8.128 8.333h17.648a2.041 2.041 0 002.037-2.04V3.987c0-1.127-.915-2.04-2.037-2.04zM23.028 6a.96.96 0 01.678.292.95.95 0 01-.003 1.377l-3.342 3.348 3.326 3.333c.189.188.292.43.292.679 0 .248-.103.49-.292.679a.96.96 0 01-.678.292.959.959 0 01-.677-.292L18.99 12.36l-3.343 3.345a.96.96 0 01-.677.292.96.96 0 01-.678-.292.962.962 0 01-.292-.68c0-.248.104-.49.292-.679l3.342-3.348-3.342-3.348A.963.963 0 0114 6.971c0-.248.104-.49.292-.679A.96.96 0 0114.97 6a.96.96 0 01.677.292l3.358 3.348 3.345-3.348A.96.96 0 0123.028 6z"
|
||||
<path d="M28 0a4 4 0 0 1 4 4v14a4 4 0 0 1-4 4H10.4a2 2 0 0 1-1.4-.6L1 13.1c-.6-.5-.9-1.3-.9-2 0-1 .3-1.7.9-2.2L9 .6a2 2 0 0 1 1.4-.6zm0 2H10.4l-8.2 8.3a1 1 0 0 0-.3.7c0 .3.1.5.3.7l8.2 8.4H28a2 2 0 0 0 2-2V4c0-1.1-.9-2-2-2zm-5 4a1 1 0 0 1 .7.3 1 1 0 0 1 0 1.4L20.4 11l3.3 3.3c.2.2.3.5.3.7 0 .3-.1.5-.3.7a1 1 0 0 1-.7.3 1 1 0 0 1-.7-.3L19 12.4l-3.4 3.3a1 1 0 0 1-.6.3 1 1 0 0 1-.7-.3 1 1 0 0 1-.3-.7c0-.2.1-.5.3-.7l3.3-3.3-3.3-3.3A1 1 0 0 1 14 7c0-.3.1-.5.3-.7A1 1 0 0 1 15 6a1 1 0 0 1 .6.3L19 9.6l3.3-3.3A1 1 0 0 1 23 6z"
|
||||
fill="currentColor"
|
||||
>
|
||||
</path>
|
||||
@ -567,7 +567,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<svg class="van-key__delete-icon"
|
||||
viewbox="0 0 32 22"
|
||||
>
|
||||
<path d="M28.016 0A3.991 3.991 0 0132 3.987v14.026c0 2.2-1.787 3.987-3.98 3.987H10.382c-.509 0-.996-.206-1.374-.585L.89 13.09C.33 12.62 0 11.84 0 11.006c0-.86.325-1.62.887-2.08L9.01.585A1.936 1.936 0 0110.383 0zm0 1.947H10.368L2.24 10.28c-.224.226-.312.432-.312.73 0 .287.094.51.312.729l8.128 8.333h17.648a2.041 2.041 0 002.037-2.04V3.987c0-1.127-.915-2.04-2.037-2.04zM23.028 6a.96.96 0 01.678.292.95.95 0 01-.003 1.377l-3.342 3.348 3.326 3.333c.189.188.292.43.292.679 0 .248-.103.49-.292.679a.96.96 0 01-.678.292.959.959 0 01-.677-.292L18.99 12.36l-3.343 3.345a.96.96 0 01-.677.292.96.96 0 01-.678-.292.962.962 0 01-.292-.68c0-.248.104-.49.292-.679l3.342-3.348-3.342-3.348A.963.963 0 0114 6.971c0-.248.104-.49.292-.679A.96.96 0 0114.97 6a.96.96 0 01.677.292l3.358 3.348 3.345-3.348A.96.96 0 0123.028 6z"
|
||||
<path d="M28 0a4 4 0 0 1 4 4v14a4 4 0 0 1-4 4H10.4a2 2 0 0 1-1.4-.6L1 13.1c-.6-.5-.9-1.3-.9-2 0-1 .3-1.7.9-2.2L9 .6a2 2 0 0 1 1.4-.6zm0 2H10.4l-8.2 8.3a1 1 0 0 0-.3.7c0 .3.1.5.3.7l8.2 8.4H28a2 2 0 0 0 2-2V4c0-1.1-.9-2-2-2zm-5 4a1 1 0 0 1 .7.3 1 1 0 0 1 0 1.4L20.4 11l3.3 3.3c.2.2.3.5.3.7 0 .3-.1.5-.3.7a1 1 0 0 1-.7.3 1 1 0 0 1-.7-.3L19 12.4l-3.4 3.3a1 1 0 0 1-.6.3 1 1 0 0 1-.7-.3 1 1 0 0 1-.3-.7c0-.2.1-.5.3-.7l3.3-3.3-3.3-3.3A1 1 0 0 1 14 7c0-.3.1-.5.3-.7A1 1 0 0 1 15 6a1 1 0 0 1 .6.3L19 9.6l3.3-3.3A1 1 0 0 1 23 6z"
|
||||
fill="currentColor"
|
||||
>
|
||||
</path>
|
||||
@ -690,7 +690,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<svg class="van-key__delete-icon"
|
||||
viewbox="0 0 32 22"
|
||||
>
|
||||
<path d="M28.016 0A3.991 3.991 0 0132 3.987v14.026c0 2.2-1.787 3.987-3.98 3.987H10.382c-.509 0-.996-.206-1.374-.585L.89 13.09C.33 12.62 0 11.84 0 11.006c0-.86.325-1.62.887-2.08L9.01.585A1.936 1.936 0 0110.383 0zm0 1.947H10.368L2.24 10.28c-.224.226-.312.432-.312.73 0 .287.094.51.312.729l8.128 8.333h17.648a2.041 2.041 0 002.037-2.04V3.987c0-1.127-.915-2.04-2.037-2.04zM23.028 6a.96.96 0 01.678.292.95.95 0 01-.003 1.377l-3.342 3.348 3.326 3.333c.189.188.292.43.292.679 0 .248-.103.49-.292.679a.96.96 0 01-.678.292.959.959 0 01-.677-.292L18.99 12.36l-3.343 3.345a.96.96 0 01-.677.292.96.96 0 01-.678-.292.962.962 0 01-.292-.68c0-.248.104-.49.292-.679l3.342-3.348-3.342-3.348A.963.963 0 0114 6.971c0-.248.104-.49.292-.679A.96.96 0 0114.97 6a.96.96 0 01.677.292l3.358 3.348 3.345-3.348A.96.96 0 0123.028 6z"
|
||||
<path d="M28 0a4 4 0 0 1 4 4v14a4 4 0 0 1-4 4H10.4a2 2 0 0 1-1.4-.6L1 13.1c-.6-.5-.9-1.3-.9-2 0-1 .3-1.7.9-2.2L9 .6a2 2 0 0 1 1.4-.6zm0 2H10.4l-8.2 8.3a1 1 0 0 0-.3.7c0 .3.1.5.3.7l8.2 8.4H28a2 2 0 0 0 2-2V4c0-1.1-.9-2-2-2zm-5 4a1 1 0 0 1 .7.3 1 1 0 0 1 0 1.4L20.4 11l3.3 3.3c.2.2.3.5.3.7 0 .3-.1.5-.3.7a1 1 0 0 1-.7.3 1 1 0 0 1-.7-.3L19 12.4l-3.4 3.3a1 1 0 0 1-.6.3 1 1 0 0 1-.7-.3 1 1 0 0 1-.3-.7c0-.2.1-.5.3-.7l3.3-3.3-3.3-3.3A1 1 0 0 1 14 7c0-.3.1-.5.3-.7A1 1 0 0 1 15 6a1 1 0 0 1 .6.3L19 9.6l3.3-3.3A1 1 0 0 1 23 6z"
|
||||
fill="currentColor"
|
||||
>
|
||||
</path>
|
||||
@ -795,7 +795,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<svg class="van-key__collapse-icon"
|
||||
viewbox="0 0 30 24"
|
||||
>
|
||||
<path d="M25.877 12.843h-1.502c-.188 0-.188 0-.188.19v1.512c0 .188 0 .188.188.188h1.5c.187 0 .187 0 .187-.188v-1.511c0-.19 0-.191-.185-.191zM17.999 10.2c0 .188 0 .188.188.188h1.687c.188 0 .188 0 .188-.188V8.688c0-.187.004-.187-.186-.19h-1.69c-.187 0-.187 0-.187.19V10.2zm2.25-3.967h1.5c.188 0 .188 0 .188-.188v-1.7c0-.19 0-.19-.188-.19h-1.5c-.189 0-.189 0-.189.19v1.7c0 .188 0 .188.19.188zm2.063 4.157h3.563c.187 0 .187 0 .187-.189V4.346c0-.19.004-.19-.185-.19h-1.69c-.187 0-.187 0-.187.188v4.155h-1.688c-.187 0-.187 0-.187.189v1.514c0 .19 0 .19.187.19zM14.812 24l2.812-3.4H12l2.813 3.4zm-9-11.157H4.31c-.188 0-.188 0-.188.19v1.512c0 .188 0 .188.188.188h1.502c.187 0 .187 0 .187-.188v-1.511c0-.19.01-.191-.189-.191zm15.937 0H8.25c-.188 0-.188 0-.188.19v1.512c0 .188 0 .188.188.188h13.5c.188 0 .188 0 .188-.188v-1.511c0-.19 0-.191-.188-.191zm-11.438-2.454h1.5c.188 0 .188 0 .188-.188V8.688c0-.187 0-.187-.188-.189h-1.5c-.187 0-.187 0-.187.189V10.2c0 .188 0 .188.187.188zM27.94 0c.563 0 .917.21 1.313.567.518.466.748.757.748 1.51v14.92c0 .567-.188 1.134-.562 1.512-.376.378-.938.566-1.313.566H2.063c-.563 0-.938-.188-1.313-.566-.562-.378-.75-.945-.75-1.511V2.078C0 1.51.188.944.562.567.938.189 1.5 0 1.875 0zm-.062 2H2v14.92h25.877V2zM5.81 4.157c.19 0 .19 0 .19.189v1.762c-.003.126-.024.126-.188.126H4.249c-.126-.003-.126-.023-.126-.188v-1.7c-.187-.19 0-.19.188-.19zm10.5 2.077h1.503c.187 0 .187 0 .187-.188v-1.7c0-.19 0-.19-.187-.19h-1.502c-.188 0-.188.001-.188.19v1.7c0 .188 0 .188.188.188zM7.875 8.5c.187 0 .187.002.187.189V10.2c0 .188 0 .188-.187.188H4.249c-.126-.002-.126-.023-.126-.188V8.625c.003-.126.024-.126.188-.126zm7.875 0c.19.002.19.002.19.189v1.575c-.003.126-.024.126-.19.126h-1.563c-.126-.002-.126-.023-.126-.188V8.625c.002-.126.023-.126.189-.126zm-6-4.342c.187 0 .187 0 .187.189v1.7c0 .188 0 .188-.187.188H8.187c-.126-.003-.126-.023-.126-.188V4.283c.003-.126.024-.126.188-.126zm3.94 0c.185 0 .372 0 .372.189v1.762c-.002.126-.023.126-.187.126h-1.75C12 6.231 12 6.211 12 6.046v-1.7c0-.19.187-.19.187-.19z"
|
||||
<path d="M26 13h-2v2h2v-2zm-8-3h2V8h-2v2zm2-4h2V4h-2v2zm2 4h4V4h-2v4h-2v2zm-7 14 3-3h-6l3 3zM6 13H4v2h2v-2zm16 0H8v2h14v-2zm-12-3h2V8h-2v2zM28 0l1 1 1 1v15l-1 2H1l-1-2V2l1-1 1-1zm0 2H2v15h26V2zM6 4v2H4V4zm10 2h2V4h-2v2zM8 9v1H4V8zm8 0v1h-2V8zm-6-5v2H8V4zm4 0v2h-2V4z"
|
||||
fill="currentColor"
|
||||
>
|
||||
</path>
|
||||
@ -818,7 +818,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<svg class="van-key__delete-icon"
|
||||
viewbox="0 0 32 22"
|
||||
>
|
||||
<path d="M28.016 0A3.991 3.991 0 0132 3.987v14.026c0 2.2-1.787 3.987-3.98 3.987H10.382c-.509 0-.996-.206-1.374-.585L.89 13.09C.33 12.62 0 11.84 0 11.006c0-.86.325-1.62.887-2.08L9.01.585A1.936 1.936 0 0110.383 0zm0 1.947H10.368L2.24 10.28c-.224.226-.312.432-.312.73 0 .287.094.51.312.729l8.128 8.333h17.648a2.041 2.041 0 002.037-2.04V3.987c0-1.127-.915-2.04-2.037-2.04zM23.028 6a.96.96 0 01.678.292.95.95 0 01-.003 1.377l-3.342 3.348 3.326 3.333c.189.188.292.43.292.679 0 .248-.103.49-.292.679a.96.96 0 01-.678.292.959.959 0 01-.677-.292L18.99 12.36l-3.343 3.345a.96.96 0 01-.677.292.96.96 0 01-.678-.292.962.962 0 01-.292-.68c0-.248.104-.49.292-.679l3.342-3.348-3.342-3.348A.963.963 0 0114 6.971c0-.248.104-.49.292-.679A.96.96 0 0114.97 6a.96.96 0 01.677.292l3.358 3.348 3.345-3.348A.96.96 0 0123.028 6z"
|
||||
<path d="M28 0a4 4 0 0 1 4 4v14a4 4 0 0 1-4 4H10.4a2 2 0 0 1-1.4-.6L1 13.1c-.6-.5-.9-1.3-.9-2 0-1 .3-1.7.9-2.2L9 .6a2 2 0 0 1 1.4-.6zm0 2H10.4l-8.2 8.3a1 1 0 0 0-.3.7c0 .3.1.5.3.7l8.2 8.4H28a2 2 0 0 0 2-2V4c0-1.1-.9-2-2-2zm-5 4a1 1 0 0 1 .7.3 1 1 0 0 1 0 1.4L20.4 11l3.3 3.3c.2.2.3.5.3.7 0 .3-.1.5-.3.7a1 1 0 0 1-.7.3 1 1 0 0 1-.7-.3L19 12.4l-3.4 3.3a1 1 0 0 1-.6.3 1 1 0 0 1-.7-.3 1 1 0 0 1-.3-.7c0-.2.1-.5.3-.7l3.3-3.3-3.3-3.3A1 1 0 0 1 14 7c0-.3.1-.5.3-.7A1 1 0 0 1 15 6a1 1 0 0 1 .6.3L19 9.6l3.3-3.3A1 1 0 0 1 23 6z"
|
||||
fill="currentColor"
|
||||
>
|
||||
</path>
|
||||
|
||||
@ -233,7 +233,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<svg class="van-key__collapse-icon"
|
||||
viewbox="0 0 30 24"
|
||||
>
|
||||
<path d="M25.877 12.843h-1.502c-.188 0-.188 0-.188.19v1.512c0 .188 0 .188.188.188h1.5c.187 0 .187 0 .187-.188v-1.511c0-.19 0-.191-.185-.191zM17.999 10.2c0 .188 0 .188.188.188h1.687c.188 0 .188 0 .188-.188V8.688c0-.187.004-.187-.186-.19h-1.69c-.187 0-.187 0-.187.19V10.2zm2.25-3.967h1.5c.188 0 .188 0 .188-.188v-1.7c0-.19 0-.19-.188-.19h-1.5c-.189 0-.189 0-.189.19v1.7c0 .188 0 .188.19.188zm2.063 4.157h3.563c.187 0 .187 0 .187-.189V4.346c0-.19.004-.19-.185-.19h-1.69c-.187 0-.187 0-.187.188v4.155h-1.688c-.187 0-.187 0-.187.189v1.514c0 .19 0 .19.187.19zM14.812 24l2.812-3.4H12l2.813 3.4zm-9-11.157H4.31c-.188 0-.188 0-.188.19v1.512c0 .188 0 .188.188.188h1.502c.187 0 .187 0 .187-.188v-1.511c0-.19.01-.191-.189-.191zm15.937 0H8.25c-.188 0-.188 0-.188.19v1.512c0 .188 0 .188.188.188h13.5c.188 0 .188 0 .188-.188v-1.511c0-.19 0-.191-.188-.191zm-11.438-2.454h1.5c.188 0 .188 0 .188-.188V8.688c0-.187 0-.187-.188-.189h-1.5c-.187 0-.187 0-.187.189V10.2c0 .188 0 .188.187.188zM27.94 0c.563 0 .917.21 1.313.567.518.466.748.757.748 1.51v14.92c0 .567-.188 1.134-.562 1.512-.376.378-.938.566-1.313.566H2.063c-.563 0-.938-.188-1.313-.566-.562-.378-.75-.945-.75-1.511V2.078C0 1.51.188.944.562.567.938.189 1.5 0 1.875 0zm-.062 2H2v14.92h25.877V2zM5.81 4.157c.19 0 .19 0 .19.189v1.762c-.003.126-.024.126-.188.126H4.249c-.126-.003-.126-.023-.126-.188v-1.7c-.187-.19 0-.19.188-.19zm10.5 2.077h1.503c.187 0 .187 0 .187-.188v-1.7c0-.19 0-.19-.187-.19h-1.502c-.188 0-.188.001-.188.19v1.7c0 .188 0 .188.188.188zM7.875 8.5c.187 0 .187.002.187.189V10.2c0 .188 0 .188-.187.188H4.249c-.126-.002-.126-.023-.126-.188V8.625c.003-.126.024-.126.188-.126zm7.875 0c.19.002.19.002.19.189v1.575c-.003.126-.024.126-.19.126h-1.563c-.126-.002-.126-.023-.126-.188V8.625c.002-.126.023-.126.189-.126zm-6-4.342c.187 0 .187 0 .187.189v1.7c0 .188 0 .188-.187.188H8.187c-.126-.003-.126-.023-.126-.188V4.283c.003-.126.024-.126.188-.126zm3.94 0c.185 0 .372 0 .372.189v1.762c-.002.126-.023.126-.187.126h-1.75C12 6.231 12 6.211 12 6.046v-1.7c0-.19.187-.19.187-.19z"
|
||||
<path d="M26 13h-2v2h2v-2zm-8-3h2V8h-2v2zm2-4h2V4h-2v2zm2 4h4V4h-2v4h-2v2zm-7 14 3-3h-6l3 3zM6 13H4v2h2v-2zm16 0H8v2h14v-2zm-12-3h2V8h-2v2zM28 0l1 1 1 1v15l-1 2H1l-1-2V2l1-1 1-1zm0 2H2v15h26V2zM6 4v2H4V4zm10 2h2V4h-2v2zM8 9v1H4V8zm8 0v1h-2V8zm-6-5v2H8V4zm4 0v2h-2V4z"
|
||||
fill="currentColor"
|
||||
>
|
||||
</path>
|
||||
@ -256,7 +256,7 @@ exports[`should render demo and match snapshot 1`] = `
|
||||
<svg class="van-key__delete-icon"
|
||||
viewbox="0 0 32 22"
|
||||
>
|
||||
<path d="M28.016 0A3.991 3.991 0 0132 3.987v14.026c0 2.2-1.787 3.987-3.98 3.987H10.382c-.509 0-.996-.206-1.374-.585L.89 13.09C.33 12.62 0 11.84 0 11.006c0-.86.325-1.62.887-2.08L9.01.585A1.936 1.936 0 0110.383 0zm0 1.947H10.368L2.24 10.28c-.224.226-.312.432-.312.73 0 .287.094.51.312.729l8.128 8.333h17.648a2.041 2.041 0 002.037-2.04V3.987c0-1.127-.915-2.04-2.037-2.04zM23.028 6a.96.96 0 01.678.292.95.95 0 01-.003 1.377l-3.342 3.348 3.326 3.333c.189.188.292.43.292.679 0 .248-.103.49-.292.679a.96.96 0 01-.678.292.959.959 0 01-.677-.292L18.99 12.36l-3.343 3.345a.96.96 0 01-.677.292.96.96 0 01-.678-.292.962.962 0 01-.292-.68c0-.248.104-.49.292-.679l3.342-3.348-3.342-3.348A.963.963 0 0114 6.971c0-.248.104-.49.292-.679A.96.96 0 0114.97 6a.96.96 0 01.677.292l3.358 3.348 3.345-3.348A.96.96 0 0123.028 6z"
|
||||
<path d="M28 0a4 4 0 0 1 4 4v14a4 4 0 0 1-4 4H10.4a2 2 0 0 1-1.4-.6L1 13.1c-.6-.5-.9-1.3-.9-2 0-1 .3-1.7.9-2.2L9 .6a2 2 0 0 1 1.4-.6zm0 2H10.4l-8.2 8.3a1 1 0 0 0-.3.7c0 .3.1.5.3.7l8.2 8.4H28a2 2 0 0 0 2-2V4c0-1.1-.9-2-2-2zm-5 4a1 1 0 0 1 .7.3 1 1 0 0 1 0 1.4L20.4 11l3.3 3.3c.2.2.3.5.3.7 0 .3-.1.5-.3.7a1 1 0 0 1-.7.3 1 1 0 0 1-.7-.3L19 12.4l-3.4 3.3a1 1 0 0 1-.6.3 1 1 0 0 1-.7-.3 1 1 0 0 1-.3-.7c0-.2.1-.5.3-.7l3.3-3.3-3.3-3.3A1 1 0 0 1 14 7c0-.3.1-.5.3-.7A1 1 0 0 1 15 6a1 1 0 0 1 .6.3L19 9.6l3.3-3.3A1 1 0 0 1 23 6z"
|
||||
fill="currentColor"
|
||||
>
|
||||
</path>
|
||||
|
||||
@ -247,14 +247,14 @@ export default defineComponent({
|
||||
// fix mobile safari page scroll down issue
|
||||
// see: https://github.com/youzan/vant/issues/7690
|
||||
if (props.disableInput) {
|
||||
event.preventDefault();
|
||||
preventDefault(event);
|
||||
}
|
||||
};
|
||||
|
||||
const createListeners = (type: 'plus' | 'minus') => ({
|
||||
const createListeners = (type: typeof actionType) => ({
|
||||
onClick: (event: MouseEvent) => {
|
||||
// disable double tap scrolling on mobile safari
|
||||
event.preventDefault();
|
||||
preventDefault(event);
|
||||
actionType = type;
|
||||
onChange();
|
||||
},
|
||||
@ -267,12 +267,7 @@ export default defineComponent({
|
||||
});
|
||||
|
||||
watch(
|
||||
[
|
||||
() => props.max,
|
||||
() => props.min,
|
||||
() => props.integer,
|
||||
() => props.decimalLength,
|
||||
],
|
||||
() => [props.max, props.min, props.integer, props.decimalLength],
|
||||
check
|
||||
);
|
||||
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
import { nextTick, ref } from 'vue';
|
||||
import { VueWrapper } from '@vue/test-utils';
|
||||
import { mockScrollTop, mount } from '../../../test';
|
||||
import { mockScrollTop, trigger, mount } from '../../../test';
|
||||
import { Sticky } from '..';
|
||||
import { ComponentInstance } from '../../utils';
|
||||
|
||||
@ -130,6 +130,7 @@ test('should allow to using offset-top prop with rem unit', async () => {
|
||||
|
||||
test('should allow to using offset-top prop with vw unit', async () => {
|
||||
Object.defineProperty(window, 'innerWidth', { value: 300 });
|
||||
trigger(window, 'resize');
|
||||
|
||||
const wrapper = mount({
|
||||
render() {
|
||||
|
||||
@ -19,18 +19,15 @@ import {
|
||||
isHidden,
|
||||
truthProp,
|
||||
numericProp,
|
||||
windowWidth,
|
||||
windowHeight,
|
||||
preventDefault,
|
||||
createNamespace,
|
||||
makeNumericProp,
|
||||
} from '../utils';
|
||||
|
||||
// Composables
|
||||
import {
|
||||
doubleRaf,
|
||||
useChildren,
|
||||
useWindowSize,
|
||||
usePageVisibility,
|
||||
} from '@vant/use';
|
||||
import { doubleRaf, useChildren, usePageVisibility } from '@vant/use';
|
||||
import { useTouch } from '../composables/use-touch';
|
||||
import { useExpose } from '../composables/use-expose';
|
||||
import { onPopupReopen } from '../composables/on-popup-reopen';
|
||||
@ -78,7 +75,6 @@ export default defineComponent({
|
||||
});
|
||||
|
||||
const touch = useTouch();
|
||||
const windowSize = useWindowSize();
|
||||
const { children, linkChildren } = useChildren(SWIPE_KEY);
|
||||
|
||||
const count = computed(() => children.length);
|
||||
@ -413,7 +409,7 @@ export default defineComponent({
|
||||
|
||||
watch(count, () => initialize(state.active));
|
||||
watch(() => props.autoplay, autoplay);
|
||||
watch([windowSize.width, windowSize.height], resize);
|
||||
watch([windowWidth, windowHeight], resize);
|
||||
watch(usePageVisibility(), (visible) => {
|
||||
if (visible === 'visible') {
|
||||
autoplay();
|
||||
|
||||
@ -24,6 +24,7 @@ import {
|
||||
truthProp,
|
||||
numericProp,
|
||||
Interceptor,
|
||||
windowWidth,
|
||||
getElementTop,
|
||||
makeStringProp,
|
||||
callInterceptor,
|
||||
@ -39,7 +40,6 @@ import { scrollLeftTo, scrollTopTo } from './utils';
|
||||
import {
|
||||
useRect,
|
||||
useChildren,
|
||||
useWindowSize,
|
||||
useScrollParent,
|
||||
useEventListener,
|
||||
onMountedOrActivated,
|
||||
@ -123,7 +123,6 @@ export default defineComponent({
|
||||
const navRef = ref<HTMLElement>();
|
||||
const wrapRef = ref<HTMLElement>();
|
||||
|
||||
const windowSize = useWindowSize();
|
||||
const scroller = useScrollParent(root);
|
||||
const [titleRefs, setTitleRefs] = useRefs<ComponentInstance>();
|
||||
const { children, linkChildren } = useChildren(TABS_KEY);
|
||||
@ -408,7 +407,7 @@ export default defineComponent({
|
||||
);
|
||||
};
|
||||
|
||||
watch([() => props.color, windowSize.width], setLine);
|
||||
watch([() => props.color, windowWidth], setLine);
|
||||
|
||||
watch(
|
||||
() => props.active,
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { useRect } from '@vant/use';
|
||||
import { useRect, useWindowSize } from '@vant/use';
|
||||
import { unref, Ref } from 'vue';
|
||||
import { isIOS as checkIsIOS } from './validate';
|
||||
|
||||
@ -84,3 +84,5 @@ export function isHidden(
|
||||
|
||||
return hidden || parentHidden;
|
||||
}
|
||||
|
||||
export const { width: windowWidth, height: windowHeight } = useWindowSize();
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
import { CSSProperties } from 'vue';
|
||||
import { useWindowSize } from '@vant/use';
|
||||
import { inBrowser } from './basic';
|
||||
import { windowWidth, windowHeight } from './dom';
|
||||
import { isDef, isNumeric } from './validate';
|
||||
|
||||
export function addUnit(value?: string | number): string | undefined {
|
||||
@ -51,15 +51,13 @@ function convertRem(value: string) {
|
||||
}
|
||||
|
||||
function convertVw(value: string) {
|
||||
const { width } = useWindowSize();
|
||||
value = value.replace(/vw/g, '');
|
||||
return (+value * width.value) / 100;
|
||||
return (+value * windowWidth.value) / 100;
|
||||
}
|
||||
|
||||
function convertVh(value: string) {
|
||||
const { height } = useWindowSize();
|
||||
value = value.replace(/vh/g, '');
|
||||
return (+value * height.value) / 100;
|
||||
return (+value * windowHeight.value) / 100;
|
||||
}
|
||||
|
||||
export function unitToPx(value: string | number): number {
|
||||
|
||||
@ -3,6 +3,7 @@ import { deepClone } from '../deep-clone';
|
||||
import { deepAssign } from '../deep-assign';
|
||||
import { isDef, isMobile, isNumeric } from '../validate';
|
||||
import { addUnit, unitToPx, camelize, formatNumber } from '../format';
|
||||
import { trigger } from '../../../test';
|
||||
|
||||
test('deepClone', () => {
|
||||
const a = { foo: 0 };
|
||||
@ -110,6 +111,7 @@ test('unitToPx', () => {
|
||||
|
||||
Object.defineProperty(window, 'innerWidth', { value: 100 });
|
||||
Object.defineProperty(window, 'innerHeight', { value: 200 });
|
||||
trigger(window, 'resize');
|
||||
|
||||
expect(unitToPx(0)).toEqual(0);
|
||||
expect(unitToPx(10)).toEqual(10);
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user