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. (zhuan) Evolution Strategies as a Scalable Alternative to Reinforcement Learning

    Evolution Strategies as a Scalable Alternative to Reinforcement Learning this blog from: https://blo ...

  2. AndroidStudio Gradle下载速度慢解决方法

    1.在软件里点开工程文件下的 build.gradle 2..在 buildscript 和 allprojects 的 repositories 中分别注释掉 jcenter() 3.在 build ...

  3. jlink的SWD与JTAG下载模式的对应接线方法

     参考博客:http://blog.csdn.net/qq_26093511/article/details/59484249 (1)如果用jtag模式下载的话需要接线:          jlink ...

  4. 剥开比原看代码16:比原是如何通过/list-transactions显示交易信息的

    作者:freewind 比原项目仓库: Github地址:https://github.com/Bytom/bytom Gitee地址:https://gitee.com/BytomBlockchai ...

  5. Twitter开发

    开发文档:https://developer.twitter.com/ the Twitter Developer Account Application 示例:https://wptweetboos ...

  6. 在centos6中编译安装httpd-2.4/搭建LAMP

    首先确保centos6安装平台安装一下环境: #yum groupinstall "Development  Tools" "Server Platform Develo ...

  7. JavaScript重点知识(一)

    一.总括 基础知识: 1.变量 2.原型和原型链 3.作用域和闭包 4.异步和单线程 JS的API: 1.BOM,DOM操作 2.事件绑定 3.Ajax 4.JSOP 5.存储 二.基础知识 2.1知 ...

  8. CPU核数和load average的关系

    在前面的文章<Linux系统监控——top命令>中我简单提到了,判断load average的数值到底大不大的判断依据,就是数值除以CPU核数,大于5,就说明超负荷运转了.——这里其实不太 ...

  9. Easy Graphics Engine vs2015使用

    vs2017: 下载 https://pan.baidu.com/s/1qWxAgeK 里面的 “ege19.01_vs2017 (推荐, 修正win10 1809 上无法正常运行的问题).zip”  ...

  10. idea使用教程(2)

    目录: 1. open和import的区别 2.修改虚拟机配置信息 3.安装目录和设置目录 1. open和import的区别 open:如果本身就是idea项目,则可以直接open打开; impor ...