vue.js背景图全屏_Vue.js插件，可让您在全屏画廊中显示图像

vue.js背景图全屏

v-img (v-img)

v-img is a plugin for Vue.js that allows you to show images in full-screen gallery by adding only one directive to the img tag.

v-img是Vue.js的插件，通过向img标签仅添加一个指令，您可以在全屏画廊中显示图像。

View demo 查看演示 Download Source 下载源

安装 (Installation)

npm (npm)

npm install v-img --save

入门 (Getting started)

In your script entry point:

在脚本入口点：

import Vue from 'vue';
import VueImg from 'v-img';

Vue.use(VueImg);

可选配置 (Optional configurations)

*in this snippet all settings has its default value. No need to specify them unless you want to change default behavior.

*在此代码段中，所有设置均为默认值。 除非您想更改默认行为，否则无需指定它们。

const vueImgConfig = {
  // Consider alt of image as its title in gallery?
  altAsTitle: false,
}
Vue.use(VueImg, vueImgConfig);

用法 (Usage)

Add v-img directive to the image.

将v-img指令添加到映像。

<img v-img src="...">

可用选项 (Available options)

Add similar directive arguments to place images to one gallery. (:name from the example below could be anything you want)

添加类似的指令参数以将图像放置到一个图库中。 (以下示例中的:name可以是您想要的任何内容)

<img v-img:name src="...">
<img v-img:name src="...">

Options that could be specified in directive value

可以在指令值中指定的选项

<img v-img="{...}" src="...">

作者 (Author)

crowdbotics

翻译自: https://vuejsexamples.com/a-plugin-for-vue-js-that-allows-you-to-show-images-in-full-screen-gallery/

vue.js背景图全屏