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

vue引入插件方法的更多相关文章

  1. Vue自定义插件方法大全

    新年第一天首先祝大家新年快乐,心想事成! 1.利用根实例构造函数的原型 //在构造函数的原型链上添加自定义属性 Vue.prototype.test = 'pomelo' //在其他组件中调用 con ...

  2. Vue引入插件

    引入Element ui 1.在当前目录下,运行:npm i element-ui -S  2.在src/main.js中添加代码 import ElementUI from 'element-ui' ...

  3. vue项目引入第三方js插件,单个js文件引入成功,使用该插件方法时报错(问题已解决)

    1.引入第三方js文件,npm安装不了 2.控制台显示引入成功 3.在methods下使用 图片看不清请看下面代码 updateTime() { setInterval(()=>{ var cd ...

  4. 在普通js文件里引入vue实例的方法

    首先是我是写了一个 Loading 插件然后 是挂在打vue.prototype 原型上的. 在main.js中use使用了这个插件. 至此vue原型是就被我挂上 $loadding方法了. 然后我想 ...

  5. Vue引入第三方JavaScript库和如何创建自己的Vue插件

    一 第三方JavaScript库 前言 .vue文件 中不解析 script标签引入js文件,只能用 import 引入 有两种用法: 1.import a from '../a' 2.import ...

  6. 创建vue项目及引入插件

    部署开发环境 安装淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org 安装webpack cnpm install ...

  7. VUE滚动条插件——vue-happy-scroll

    最近自己在自学vue2.0,然后就自己摸索做一个简单的后台管理系统,在做的过程中,总感觉不同浏览器自带的滚动条样式不统一,也很难看,所以就在网上找一些使用vue的滚动条插件.最开始用的是Easy-sc ...

  8. 开发vue全局插件的4种方式

    定义全局插件的步骤 定义全局插件 pluginsUtil.js Vue.js 的插件应当有一个公开方法 install .这个方法的第一个参数是 Vue 构造器,第二个参数是一个可选的选项对象: ex ...

  9. vue封装插件并发布到npm上

    vue封装插件并发布到npm上 项目初始化 首先,要创建项目,封装vue的插件用webpack-simple很合适,vue init webpack-simple 项目名称此命令创建我们的项目的目录, ...

随机推荐

  1. sql查询数据结果发送到邮箱

    #!/bin/bash user=root password=xx dbname=xx DATE=`date +%F` #注意:此处mysql要用全路劲,否则计划任务会执行失败 /mydata/mys ...

  2. pandas.to_json&to_dict&from_json&from_dict解读

    pandas 中的to_dict 可以对DataFrame类型的数据进行转换 可以选择六种的转换类型,分别对应于参数 ‘dict’, ‘list’, ‘series’, ‘split’, ‘recor ...

  3. 利用vue v-bind属性绑定bootstrap样式以及输出数据

    自从知道了bootstrap,就被他简介,大气美观的样式吸引,即使在vue框架中,仍旧想使用,下面给出了vue适配版和原版的代码,以飨读者 数据输出部分 export default { data() ...

  4. 在Google Maps 上点击标签显示说明并保持不消失

    JS如下: (function() {     window.onload = function() {         // Creating an object literal containin ...

  5. error MSB6006: “cmd.exe”已退出,代码为 3。

    error MSB6006: “cmd.exe”已退出,代码为 3. 这两天调程序遇到一个奇怪的问题. C:\Program Files (x86)\MSBuild\Microsoft.Cpp\v4. ...

  6. list深拷贝和浅拷贝

    在Python中,经常要对一个list进行复制.对于复制,自然的就有深拷贝与浅拷贝问题.深拷贝与浅拷贝的区别在于,当从原本的list复制出的list之后,修改其中的任意一个是否会对另一个造成影响,即这 ...

  7. luogu 4234 最小差值生成树 LCT

    感觉码力严重下降~ #include <bits/stdc++.h> #define N 400006 #define inf 1000000000 #define setIO(s) fr ...

  8. CF1230 E. Kamil and Making a Stream gcd+暴力

    比赛的时候TLE,第二天发现合并方向合并错了~ 改了一下顺序就切了~ 又掉分了,好难过QAQ...... Code: #include <bits/stdc++.h> #define N ...

  9. 第二章 Unicode简介

    /*------------------------------------------------------------- screensize.cpp -- Displays screen si ...

  10. Java进阶知识11 Hibernate多对多单向关联(Annotation+XML实现)

    1.Annotation 注解版 1.1.应用场景(Student-Teacher):当学生知道有哪些老师教,但是老师不知道自己教哪些学生时,可用单向关联 1.2.创建Teacher类和Student ...