zoukankan      html  css  js  c++  java
  • 图片点击全屏插件

    npm install v-img --save


      import Vue from 'vue';
      import VueImg from 'v-img';
     
      Vue.use(VueImg);
     
     
     
    .vue文件
     
    <template>
    <div class="hello">
    <h1>{{ msg }}</h1>
    <div style="height:200px;200px;">
    <el-carousel height="200px" indicator-position="none">
    <el-carousel-item v-for="(item, index) in picture" :key="index">
    {{index}}
    <img :src="item.src"
    class="item-img"
    style="100%;"
    v-img:group
    alt>
    </el-carousel-item>
    </el-carousel>
    </div>
    <el-button type="primary">主要按钮</el-button>
    </div>
    </template>

    <script>

    export default {
    name: 'HelloWorld',
    data () {
    return {
    msg: 'Welcome to Your Vue.js App',
    num: 2,
    picture: [{src: require('../assets/logo.png'), index:'1'},
    {src: require('../assets/1.jpg'), index:'2'},
    {src: require('../assets/logo.png'), index:'3'},
    {src: require('../assets/logo.png'), index:'4'},
    {src: require('../assets/logo.png'), index:'5'}]
    }
    }
    }
    </script>

    <style scoped>
    </style>
  • 相关阅读:
    java内存溢出
    jstack命令使用
    JVM问题排查步骤
    c++指针常量和常量指针
    c++ 通讯录
    冒泡排序
    翻转数组
    敲桌子
    求一个100-999之间的水仙花数
    elasticsearch 模板的使用
  • 原文地址:https://www.cnblogs.com/cs122/p/10484643.html
Copyright © 2011-2022 走看看