• vue引入插件方法



    jQuery插件
    npm install jquery --save-dev

    需要用jQuery的文件中引入:
    import $ from 'jquery'

    轮播图插件
    安装:npm install vue-awesome-swiper --save-dev

    main.js中引入:
    import VueAwesomeSwiper from 'vue-awesome-swiper';
    Vue.use(VueAwesomeSwiper)

    在需要的文件中使用:

    <swiper :options="swiperOption">
              <swiper-slide class="swiper-slide" v-for="(item, index) in slide" :key="index"><img :src="item.img" alt="" /></swiper-slide>
              <div class="swiper-pagination" slot="pagination"></div>
              <div class="swiper-button-prev" slot="button-prev"></div>
              <div class="swiper-button-next" slot="button-next"></div>
    </swiper>

    data() {
            return {
                slide: [{ img: require('@/assets/images/banner1.jpg')}, { img: require('@/assets/images/banner2.jpg')}, { img: require('@/assets/images/banner3.jpg')}],
                swiperOption: {
                    pagination: {
                        el: '.swiper-pagination',
                        clickable: true
                    },
                    navigation: {
                        nextEl: '.swiper-button-next',
                        prevEl: '.swiper-button-prev'
                    },
                    autoplay: {
                        delay: 3000
                    },
                    loop: true,
                    mousewheel: true
                },
            };
      },

    设置浏览器标题(title)插件:

    安装:npm install vue-wechat-title --save

    main.js中引入:

    import VueWechatTitle from 'vue-wechat-title'

    Vue.use(VueWechatTitle)

    在需要的文件中使用:

    加上下面这句话即可

    <div v-wechat-title="首页--XX公司"></div>


    js-cookie插件
    npm install --save js-cookie

  • 相关阅读:
    关于webapi post 使用多个参数的间接用法
    Web Api 中Get 和 Post 请求的多种情况分析
    Juery On事件的 事件触发流程
    构建ASP.NET网站十大必备工具(1)
    了解 XSS 攻击原理
    c#访问Oracle问题及解决方法
    C#连接数据库的四种方法
    OracleClient卸载
    oracle的默认表空间
    oracle Service Name和SID的区别
  • 原文地址:https://www.cnblogs.com/zyl-930826/p/11636355.html
Copyright © 2020-2023  润新知