Compare commits

...

4 Commits

Author SHA1 Message Date
neverland
721ecb6e76
chore(lazyload): remove some legecy code (#8650) 2021-05-02 11:49:32 +08:00
neverland
819018ef68
docs: remove wechat group qrcode (#8649) 2021-05-02 11:31:46 +08:00
neverland
e8b34dfb46
docs: add more CDN services link (#8648) 2021-05-02 11:26:18 +08:00
neverland
511b316074
docs: add tip for using global method in setup (#8647) 2021-05-02 11:16:14 +08:00
10 changed files with 25 additions and 45 deletions

View File

@ -102,12 +102,6 @@ Vant 3 支持现代浏览器以及 Chrome >= 51、iOS >= 10.0(与 Vue 3 一致
<img src="https://img.yzcdn.cn/vant/preview_qrcode_20180528.png" width="220" height="220" > <img src="https://img.yzcdn.cn/vant/preview_qrcode_20180528.png" width="220" height="220" >
## 微信讨论群
欢迎大家加入 Vant 交流群一起讨论,添加下方微信并注明『加入 Vant 交流群』即可
<img src="https://img.yzcdn.cn/vant/wechat_20180606.png" width="220" height="292" >
## 开源协议 ## 开源协议
本项目基于 [MIT](https://zh.wikipedia.org/wiki/MIT%E8%A8%B1%E5%8F%AF%E8%AD%89) 协议,请自由地享受和参与开源。 本项目基于 [MIT](https://zh.wikipedia.org/wiki/MIT%E8%A8%B1%E5%8F%AF%E8%AD%89) 协议,请自由地享受和参与开源。

View File

@ -44,6 +44,12 @@ The easiest way to use Vant is to include a CDN link in the html file, after whi
</script> </script>
``` ```
You can use Vant through these free CDN services:
- [jsdelivr](https://www.jsdelivr.com/package/npm/vant)
- [cdnjs](https://cdnjs.com/libraries/vant)
- [unpkg](https://unpkg.com/)
### CLI ### CLI
We recommend to use [Vue Cli](https://cli.vuejs.org/) to create a new project. We recommend to use [Vue Cli](https://cli.vuejs.org/) to create a new project.

View File

@ -51,6 +51,12 @@ npm i vant@next -S
</script> </script>
``` ```
你可以通过以下免费 CDN 服务来使用 Vant:
- [jsdelivr](https://www.jsdelivr.com/package/npm/vant)
- [cdnjs](https://cdnjs.com/libraries/vant)
- [unpkg](https://unpkg.com/)
### 通过脚手架安装 ### 通过脚手架安装
在新项目中使用 Vant 时,推荐使用 Vue 官方提供的脚手架 [Vue Cli](https://cli.vuejs.org/zh/) 创建项目并安装 Vant。 在新项目中使用 Vant 时,推荐使用 Vue 官方提供的脚手架 [Vue Cli](https://cli.vuejs.org/zh/) 创建项目并安装 Vant。

View File

@ -1,5 +1,5 @@
/* eslint-disable max-classes-per-file */ /* eslint-disable max-classes-per-file */
import { find, remove, ArrayFrom } from './util'; import { find, remove } from './util';
const defaultOptions = { const defaultOptions = {
selector: 'img', selector: 'img',
@ -44,7 +44,7 @@ class LazyContainer {
} }
getImgs() { getImgs() {
return ArrayFrom(this.el.querySelectorAll(this.options.selector)); return Array.from(this.el.querySelectorAll(this.options.selector));
} }
clear() { clear() {
@ -57,10 +57,9 @@ class LazyContainer {
} }
} }
export default class LazyContainerMananger { export default class LazyContainerManager {
constructor({ lazy }) { constructor({ lazy }) {
this.lazy = lazy; this.lazy = lazy;
lazy.lazyContainerMananger = this;
this._queue = []; this._queue = [];
} }

View File

@ -3,7 +3,6 @@ import {
inBrowser, inBrowser,
CustomEvent, CustomEvent,
remove, remove,
some,
find, find,
_, _,
throttle, throttle,
@ -52,7 +51,6 @@ export default function () {
observer, observer,
observerOptions, observerOptions,
}) { }) {
this.version = '__VUE_LAZYLOAD_VERSION__';
this.mode = modeType.event; this.mode = modeType.event;
this.ListenerQueue = []; this.ListenerQueue = [];
this.TargetIndex = 0; this.TargetIndex = 0;
@ -126,7 +124,7 @@ export default function () {
* @return * @return
*/ */
add(el, binding, vnode) { add(el, binding, vnode) {
if (some(this.ListenerQueue, (item) => item.el === el)) { if (this.ListenerQueue.some((item) => item.el === el)) {
this.update(el, binding); this.update(el, binding);
return nextTick(this.lazyLoadHandler); return nextTick(this.lazyLoadHandler);
} }

View File

@ -1,12 +1,5 @@
import { loadImageAsync, noop } from './util'; import { loadImageAsync, noop } from './util';
// el: {
// state,
// src,
// error,
// loading
// }
export default class ReactiveListener { export default class ReactiveListener {
constructor({ constructor({
el, el,

View File

@ -57,17 +57,6 @@ function remove(arr, item) {
if (index > -1) return arr.splice(index, 1); if (index > -1) return arr.splice(index, 1);
} }
function some(arr, fn) {
let has = false;
for (let i = 0, len = arr.length; i < len; i++) {
if (fn(arr[i])) {
has = true;
break;
}
}
return has;
}
function getBestSelectionFromSrcset(el, scale) { function getBestSelectionFromSrcset(el, scale) {
if (el.tagName !== 'IMG' || !el.getAttribute('data-srcset')) return; if (el.tagName !== 'IMG' || !el.getAttribute('data-srcset')) return;
@ -290,15 +279,6 @@ function isObject(obj) {
return obj !== null && typeof obj === 'object'; return obj !== null && typeof obj === 'object';
} }
function ArrayFrom(arrLike) {
const len = arrLike.length;
const list = [];
for (let i = 0; i < len; i++) {
list.push(arrLike[i]);
}
return list;
}
function noop() {} function noop() {}
class ImageCache { class ImageCache {
@ -331,10 +311,8 @@ export {
inBrowser, inBrowser,
CustomEvent, CustomEvent,
remove, remove,
some,
find, find,
noop, noop,
ArrayFrom,
_, _,
isObject, isObject,
throttle, throttle,

View File

@ -119,7 +119,7 @@ Dialog.confirm({
### 全局方法 ### 全局方法
通过 `app.use` 注册 Dialog 组件后,会自动在 app 的所有子组件上挂载 `$dialog` 方法,在所有组件内部都可以直接调用此方法。 通过 `app.use` 全局注册 Dialog 组件后,会自动在 app 的所有子组件上挂载 `$dialog` 方法,在所有组件内部都可以直接调用此方法。
```js ```js
export default { export default {
@ -131,6 +131,8 @@ export default {
}; };
``` ```
> Tips: 由于 setup 选项中无法访问 this因此不能使用上述方式请通过 import 引入。
### 组件调用 ### 组件调用
如果需要在弹窗内嵌入组件或其他自定义内容,可以使用组件调用的方式。 如果需要在弹窗内嵌入组件或其他自定义内容,可以使用组件调用的方式。

View File

@ -79,7 +79,7 @@ Notify({
### 全局方法 ### 全局方法
通过 `app.use` 注册 Notify 组件后,会自动在 app 的所有子组件上挂载 `$notify` 方法,便于在组件内调用。 通过 `app.use` 全局注册 Notify 组件后,会自动在 app 的所有子组件上挂载 `$notify` 方法,便于在组件内调用。
```js ```js
export default { export default {
@ -89,6 +89,8 @@ export default {
}; };
``` ```
> Tips: 由于 setup 选项中无法访问 this因此不能使用上述方式请通过 import 引入。
### 组件调用 ### 组件调用
如果需要在 Notify 内嵌入组件或其他自定义内容,可以使用组件调用的方式。 如果需要在 Notify 内嵌入组件或其他自定义内容,可以使用组件调用的方式。

View File

@ -107,7 +107,7 @@ const timer = setInterval(() => {
### 全局方法 ### 全局方法
通过 `app.use` 注册 Toast 组件后,会自动在 app 的所有子组件上挂载 `$toast` 方法,便于在组件内调用。 通过 `app.use` 全局注册 Toast 组件后,会自动在 app 的所有子组件上挂载 `$toast` 方法,便于在组件内调用。
```js ```js
export default { export default {
@ -117,6 +117,8 @@ export default {
}; };
``` ```
> Tips: 由于 setup 选项中无法访问 this因此不能使用上述方式请通过 import 引入。
### 单例模式 ### 单例模式
Toast 默认采用单例模式,即同一时间只会存在一个 Toast如果需要在同一时间弹出多个 Toast可以参考下面的示例 Toast 默认采用单例模式,即同一时间只会存在一个 Toast如果需要在同一时间弹出多个 Toast可以参考下面的示例