docs: prettier all markdown files
This commit is contained in:
chenjiahan
neverland
+56
-62
@@ -16,7 +16,7 @@ Vue.use(ImagePreview);
|
||||
```js
|
||||
ImagePreview([
|
||||
'https://img.yzcdn.cn/vant/apple-1.jpg',
|
||||
'https://img.yzcdn.cn/vant/apple-2.jpg'
|
||||
'https://img.yzcdn.cn/vant/apple-2.jpg',
|
||||
]);
|
||||
```
|
||||
|
||||
@@ -26,12 +26,12 @@ ImagePreview([
|
||||
ImagePreview({
|
||||
images: [
|
||||
'https://img.yzcdn.cn/vant/apple-1.jpg',
|
||||
'https://img.yzcdn.cn/vant/apple-2.jpg'
|
||||
'https://img.yzcdn.cn/vant/apple-2.jpg',
|
||||
],
|
||||
startPosition: 1,
|
||||
onClose() {
|
||||
// do something
|
||||
}
|
||||
},
|
||||
});
|
||||
```
|
||||
|
||||
@@ -41,11 +41,8 @@ After setting the `closeable` attribute, the close icon will be displayed in the
|
||||
|
||||
```js
|
||||
ImagePreview({
|
||||
images: [
|
||||
'https://img.yzcdn.cn/1.jpg',
|
||||
'https://img.yzcdn.cn/2.jpg'
|
||||
],
|
||||
closeable: true
|
||||
images: ['https://img.yzcdn.cn/1.jpg', 'https://img.yzcdn.cn/2.jpg'],
|
||||
closeable: true,
|
||||
});
|
||||
```
|
||||
|
||||
@@ -55,9 +52,9 @@ ImagePreview({
|
||||
const instance = ImagePreview({
|
||||
images: [
|
||||
'https://img.yzcdn.cn/vant/apple-1.jpg',
|
||||
'https://img.yzcdn.cn/vant/apple-2.jpg'
|
||||
'https://img.yzcdn.cn/vant/apple-2.jpg',
|
||||
],
|
||||
asyncClose: true
|
||||
asyncClose: true,
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
@@ -79,19 +76,16 @@ export default {
|
||||
return {
|
||||
show: false,
|
||||
index: 0,
|
||||
images: [
|
||||
'https://img.yzcdn.cn/1.jpg',
|
||||
'https://img.yzcdn.cn/2.jpg'
|
||||
]
|
||||
images: ['https://img.yzcdn.cn/1.jpg', 'https://img.yzcdn.cn/2.jpg'],
|
||||
};
|
||||
},
|
||||
|
||||
methods: {
|
||||
onChange(index) {
|
||||
this.index = index;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
```
|
||||
|
||||
## API
|
||||
@@ -99,48 +93,48 @@ export default {
|
||||
### Options
|
||||
|
||||
| Attribute | Description | Type | Default |
|
||||
|------|------|------|------|
|
||||
| images | Images URL list | *string[]* | `[]` |
|
||||
| startPosition | Start position | *number \| string* | `0` |
|
||||
| showIndex | Whether to show index | *boolean* | `true` |
|
||||
| showIndicators | Whether to show indicators | *boolean* | `false` |
|
||||
| loop | Whether to enable loop | *boolean* | `true` |
|
||||
| swipeDuration | Animation duration (ms) | *number \| string* | `500` |
|
||||
| onClose | Triggered when close | *Function* | - |
|
||||
| onChange `v2.0.3` | Triggered when current image change | *Function* | - |
|
||||
| onScale | Triggered when current image scale | *Function* | - |
|
||||
| closeOnPopstate | Whether to close when popstate | *boolean* | `false` |
|
||||
| asyncClose | Whether to enable async close | *boolean* | `false` |
|
||||
| className | Custom className | *any* | - |
|
||||
| maxZoom | Max zoom | *number \| string* | `3` |
|
||||
| minZoom | Min zoom | *number \| string* | `1/3` |
|
||||
| closeable | Whether to show close icon | *boolean* | `false` |
|
||||
| closeIcon | Close icon name | *string* | `clear` |
|
||||
| closeIconPosition | Close icon position，can be set to `top-left` `bottom-left` `bottom-right` | *string* | `top-right` |
|
||||
| --- | --- | --- | --- |
|
||||
| images | Images URL list | _string[]_ | `[]` |
|
||||
| startPosition | Start position | _number \| string_ | `0` |
|
||||
| showIndex | Whether to show index | _boolean_ | `true` |
|
||||
| showIndicators | Whether to show indicators | _boolean_ | `false` |
|
||||
| loop | Whether to enable loop | _boolean_ | `true` |
|
||||
| swipeDuration | Animation duration (ms) | _number \| string_ | `500` |
|
||||
| onClose | Triggered when close | _Function_ | - |
|
||||
| onChange `v2.0.3` | Triggered when current image change | _Function_ | - |
|
||||
| onScale | Triggered when current image scale | _Function_ | - |
|
||||
| closeOnPopstate | Whether to close when popstate | _boolean_ | `false` |
|
||||
| asyncClose | Whether to enable async close | _boolean_ | `false` |
|
||||
| className | Custom className | _any_ | - |
|
||||
| maxZoom | Max zoom | _number \| string_ | `3` |
|
||||
| minZoom | Min zoom | _number \| string_ | `1/3` |
|
||||
| closeable | Whether to show close icon | _boolean_ | `false` |
|
||||
| closeIcon | Close icon name | _string_ | `clear` |
|
||||
| closeIconPosition | Close icon position，can be set to `top-left` `bottom-left` `bottom-right` | _string_ | `top-right` |
|
||||
|
||||
### Props
|
||||
|
||||
| Attribute | Description | Type | Default |
|
||||
|------|------|------|------|
|
||||
| images | Images URL list | *string[]* | `[]` |
|
||||
| start-position | Start position | *number \| string* | `0` |
|
||||
| swipe-duration | Animation duration (ms) | *number \| string* | `500` |
|
||||
| show-index | Whether to show index | *boolean* | `true` |
|
||||
| show-indicators | Whether to show indicators | *boolean* | `false` |
|
||||
| loop | Whether to enable loop | *boolean* | `true` |
|
||||
| async-close | Whether to enable async close | *boolean* | `false` |
|
||||
| close-on-popstate | Whether to close when popstate | *boolean* | `false` |
|
||||
| class-name | Custom className | *any* | - |
|
||||
| max-zoom | Max zoom | *number \| string* | `3` |
|
||||
| min-zoom | Min zoom | *number \| string* | `1/3` |
|
||||
| closeable `v2.5.0` | Whether to show close icon | *boolean* | `false` |
|
||||
| close-icon `v2.5.0` | Close icon name | *string* | `clear` |
|
||||
| close-icon-position `v2.5.0` | Close icon position，can be set to `top-left` `bottom-left` `bottom-right` | *string* | `top-right` |
|
||||
| --- | --- | --- | --- |
|
||||
| images | Images URL list | _string[]_ | `[]` |
|
||||
| start-position | Start position | _number \| string_ | `0` |
|
||||
| swipe-duration | Animation duration (ms) | _number \| string_ | `500` |
|
||||
| show-index | Whether to show index | _boolean_ | `true` |
|
||||
| show-indicators | Whether to show indicators | _boolean_ | `false` |
|
||||
| loop | Whether to enable loop | _boolean_ | `true` |
|
||||
| async-close | Whether to enable async close | _boolean_ | `false` |
|
||||
| close-on-popstate | Whether to close when popstate | _boolean_ | `false` |
|
||||
| class-name | Custom className | _any_ | - |
|
||||
| max-zoom | Max zoom | _number \| string_ | `3` |
|
||||
| min-zoom | Min zoom | _number \| string_ | `1/3` |
|
||||
| closeable `v2.5.0` | Whether to show close icon | _boolean_ | `false` |
|
||||
| close-icon `v2.5.0` | Close icon name | _string_ | `clear` |
|
||||
| close-icon-position `v2.5.0` | Close icon position，can be set to `top-left` `bottom-left` `bottom-right` | _string_ | `top-right` |
|
||||
|
||||
### Events
|
||||
|
||||
| Event | Description | Parameters |
|
||||
|------|------|------|
|
||||
| --- | --- | --- |
|
||||
| close | Triggered when close | { index, url } |
|
||||
| closed `v2.5.6` | Triggered after closed | - |
|
||||
| change | Triggered when current image change | index: index of current image |
|
||||
@@ -148,21 +142,21 @@ export default {
|
||||
|
||||
### Slots
|
||||
|
||||
| Name | Description |
|
||||
|------|------|
|
||||
| index | Custom index |
|
||||
| Name | Description |
|
||||
| ----- | -------------------------------------------- |
|
||||
| index | Custom index |
|
||||
| cover | Custom content that covers the image preview |
|
||||
|
||||
### onClose Parematers
|
||||
|
||||
| Attribute | Description | Type |
|
||||
|------|------|------|
|
||||
| url | Url of current image | *number* |
|
||||
| index | Index of current image | *number* |
|
||||
| Attribute | Description | Type |
|
||||
| --------- | ---------------------- | -------- |
|
||||
| url | Url of current image | _number_ |
|
||||
| index | Index of current image | _number_ |
|
||||
|
||||
### onScale Parematers
|
||||
|
||||
| Attribute | Description | Type |
|
||||
|------|------|------|
|
||||
| index | Index of current image | *number* |
|
||||
| scale | scale of current image | *number* |
|
||||
| Attribute | Description | Type |
|
||||
| --------- | ---------------------- | -------- |
|
||||
| index | Index of current image | _number_ |
|
||||
| scale | scale of current image | _number_ |
|
||||
|
||||
Reference in New Issue
Block a user