element-ui

  npm install element-ui -- save;

  main.js中

    import Element from 'element-ui';

    import 'element-ui/lib/theme-chalk/index.css';

    Vue.use(Element);

swiper

  npm install vue-awesome-swiper --save

  main.js中

    import VueAwesomeSwiper from 'vue-awesome-swiper';

    import 'swiper/dist/css/swiper.css';
    Vue.use(VueAwesomeSwiper);
  
  页面中用法  
    <swiper :options="swiperOption" ref="mySwiper">
      <swiper-slide>
        <img src="../../assets/home/home_banner_1.png"/>
      </swiper-slide>
      <swiper-slide>
        <img src="../../assets/home/home_banner_2.png"/>
      </swiper-slide>
      <!-- Optional controls -->
      <div class="swiper-pagination" slot="pagination"></div>
    </swiper>
 
    
     data中: 
      swiperOption: {
        loop: true,
        speed: 1000,
        autoplay: {
          delay: 2000,
          autoplayDisableOnInteraction: false
        },
        pagination: {
          el: '.swiper-pagination'
        }
      }
 
    computed: {
      swiper() {
        return this.$refs.mySwiper.swiper
      }
    }
  
  

vue项目中引入第三方框架的更多相关文章

  1. vue-cli项目中引入第三方插件

    前言 最近有小伙伴问道如何在vue-cli项目中引入第三方插件或者库,例如如果想在项目中使用jQuery中的Ajax请求数据呢?或者我想使用Bootstrap框架呢?等等这些问题,本篇博客将带你学习如 ...

  2. vue element-ui中引入第三方icon

    vue element-ui中引入第三方icon 把图标加入项目 设置项目名称,下载项目(项目名称自定义) 解压项目到开发目录 在main.js中全局引入css文件 修改下载下来的项目中的css文件, ...

  3. 在vue项目中引入jquery

    在vue项目中引入jquerycnpm install jquery --save在main.js中引入,加入下面这行代码:import 'jquery'注:有些项目是按需加载的,在main.js里面 ...

  4. vue项目中引入Sass

    Sass作为目前成熟,稳定,强大的css扩展语言,让越来越多的前端工程师喜欢上它.下面介绍了如何在vue项目 中引入Sass. 首先在项目文件夹执行命令 npm install vue-cli -g, ...

  5. 前端学习笔记系列一:10整体移动vscode代码块、VSCode 使用 stylus,配置格式化设置、在vue项目中引入bootstrap

    1.整体移动vscode代码块 凭借操作的经验我们能够轻松地知道将代码整体往右移只需选中代码按Tab键即可.其实往左移也很简单: 选中之后按下 shift+Tab键 即可. 2.VSCode 使用 s ...

  6. 在vue项目中引入阿里图标库小记

    使用Vue技术栈开发不仅效率高,而且很友好,而且还有很多基于vue的UI框架,例如:element等,但是这类框架美中不足的是,图标太少.为了解决这个问题,不得不引入第三方字体库,今天以阿里图标库为例 ...

  7. 如何在Vue项目中引入jQuery?

    假设你的项目由vue-cli初始化 (e.g. vue init webpack my-project). 在你的vue项目目录下执行: npm install jquery --save-dev 打 ...

  8. vue项目中引入循环执行setInterval或者requestAnimationFrame的用法等

    项目中循环计时处理某些方法的情况还是比较常见的,一般会用setInterval来处理,但是这个方法会似的页面卡顿等使用体验不好. 所以就使用浏览器提供的requestAnimationFrame方法, ...

  9. vue-cli创建的项目中引入第三方库报错 'caller', 'calle', and 'arguments' properties may not be...

    http://blog.csdn.net/sophie_u/article/details/76223978 以在vue中引入mui第三方库为例: 虽然针对vue,有单独的vue-mui库可以使用,但 ...

随机推荐

  1. 题解——洛谷P1550 [USACO08OCT]打井Watering Hole(最小生成树,建图)

    题面 题目背景 John的农场缺水了!!! 题目描述 Farmer John has decided to bring water to his N (1 <= N <= 300) pas ...

  2. DPDK安装方法 17.12.13

    DPDK安装方法 17.12.13 Ubuntu: $ git clone https://github.com/DPDK/dpdk.git $ cd dpdk/ $ export RTE_ARCH= ...

  3. HDU 3047 Zjnu Stadium(带权并查集)

    http://acm.hdu.edu.cn/showproblem.php?pid=3047 题意: 给出n个座位,有m次询问,每次a,b,d表示b要在a右边d个位置处,问有几个询问是错误的. 思路: ...

  4. Java 数据库篇

    一.简易封装JDBC工具类: package com.jackie.MyBatis.main; import java.sql.Connection; import java.sql.DriverMa ...

  5. bean的实例化有几种实现方式

    三种实例化bean的方式   在spring中有三中实例化bean的方式: 一.使用构造器实例化:(90%通常使用的一个方法) 二.使用静态工厂方法实例化: 三.使用实例化工厂方法实例化. 每种实例化 ...

  6. 深入浅析Spring的AOP实现原理

    转载来源:https://www.jb51.net/article/81788.htm AOP(Aspect-OrientedProgramming,面向切面编程),可以说是OOP(Object-Or ...

  7. java.io.FileNotFoundException异常,一是“拒绝访问”,二是“系统找不到指定路径”

    关于java.io.FileNotFoundException异常 因为这个异常抛出俩种情况:一是“拒绝访问”,二是“系统找不到指定路径” 这里只讲明什么时候抛拒绝访问,什么时候抛找不到指定路径. 原 ...

  8. Jmeter 如何引入外部jar 包

    最近使用Jmeter 测试需要引入Jar包,之前也遇到过,用过两种方式,各有利弊,今天又接触了一种方式,挺好,在此做一总结. 方法一:测试计划 通过 Add directory or jar to c ...

  9. log4j动态监听配置修改

    一般情况下,log4j的配置文件是log4j.properties.但是每次我们修改了配置文件之后程序并不会自动去加载,而需要我们去重启程序.那么怎么样才能让程序不用重启就监听到变化呢.代码如下: p ...

  10. legend2---开发日志1(legend的数据库整体设计思路是什么)

    legend2---开发日志1(legend的数据库整体设计思路是什么) 一.总结 一句话总结:不同种类的物品分不同的表放,不放到一个物品表里,取所有物品时一个个表的取就好了 不同种类的物品分不同的表 ...