标签:unp ref imp lib use type blog tps one
Element-UI是一套基于Vue2.0的UI组件库,http://element.eleme.io/#/zh-CN/component/carousel
首先npm install element-ui --save
然后在main.js中引入:
import Vue from ‘vue‘ import ElementUI from ‘element-ui‘ import ‘element-ui/lib/theme-default/index.css‘ import App from ‘./App.vue‘ Vue.use(ElementUI) new Vue({ el: ‘#app‘, render: h => h(App) })
即可使用
<template> <el-carousel :interval="4000" type="card" height="200px"> <el-carousel-item v-for="item in 6" :key="item"> <h3>{{ item }}</h3> </el-carousel-item> </el-carousel> </template> <style> .el-carousel__item h3 { color: #475669; font-size: 14px; opacity: 0.75; line-height: 200px; margin: 0; } .el-carousel__item:nth-child(2n) { background-color: #99a9bf; } .el-carousel__item:nth-child(2n+1) { background-color: #d3dce6; } </style>
若单页则引入js和css即可
<!-- 引入样式 --> <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-default/index.css"> <!-- 引入组件库 --> <script src="https://unpkg.com/element-ui/lib/index.js"></script>
标签:unp ref imp lib use type blog tps one
原文地址:http://www.cnblogs.com/rlann/p/7244130.html