Skip to content

Commit

Permalink
Translation in english
Browse files Browse the repository at this point in the history
  • Loading branch information
rap2hpoutre authored Mar 2, 2018
1 parent 9294325 commit 152d294
Showing 1 changed file with 14 additions and 15 deletions.
29 changes: 14 additions & 15 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# Vue preview plugin

> 一个Vue集成[PhotoSwipe](https://github.com/dimsemenov/PhotoSwipe)图片预览插件
> 一 A Vue Integrated [PhotoSwipe](https://github.com/dimsemenov/PhotoSwipe) Image Preview Plugin
![](https://img.shields.io/npm/dm/vue-preview.svg)
![](https://img.shields.io/npm/v/vue-preview.svg)
Expand All @@ -17,13 +17,12 @@ npm i vue-preview -S

## Usage

使用须知:
Notice:
- This plugin currently support vue2.0 and above
- `img` tag class can not be removed

* 插件目前仅支持vue2.0以上版本
* img标签上的class不能去掉
If you are using `vue-cli` generated projects, you may need to modify the `webpack.base.conf.js` file loaders and add a loader. The reason is the plugin uses ES6 syntax, so you need to compile the code.

如果你是使用vue-cli生成的项目,可能需要你修改`webpack.base.conf.js`文件中的loaders,添加一个loader。
原因:插件编写中使用了es6的语法,需要进行代码编译
``` javascript
{
test: /vue-preview.src.*?js$/,
Expand All @@ -40,7 +39,7 @@ Vue.use(VuePreview)

### Examples

```
```html
<template>
<img class="preview-img" v-for="(item, index) in list" :src="item.src" height="100" @click="$preview.open(index, list)">
</template>
Expand All @@ -64,19 +63,19 @@ export default {
</script>
```

### Mothods
### Methods

插件提供以下两个方法,```vm```代表组件实例
The plugin provides the following two methods, `vm` represents a component instance:

#### vm.$preview.open(index, list, options)

参数说明:
Parameters Description:

| 参数 | 说明 | 类型 | 必需
| :--: | :--: | :--: | :--:
| index |当前图片的索引值| Number |
| list |图片列表 | Array |
| options |预览插件的配置选项([参考PhotoSwipe配置](http://photoswipe.com/documentation/options.html) | Object |
| Parameters | Description | Type | Required
| :--- | :--- | :--- | :---
| index |The index of the current image | Number | Yes
| list |Image list | Array | Yes
| options |Configuration options for Preview Plugin ([see PhotoSwipe Configuration](http://photoswipe.com/documentation/options.html)) | Object | No

#### vm.$preview.close()

Expand Down

0 comments on commit 152d294

Please sign in to comment.