一、全局安装element-ui
npm install element-ui --save
有淘宝镜像的情况下cnpm install element-ui --save 或者cnpm install element-ui -S
二、在main.js文件中加入以下内容,这样就可以全局使用;
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI)
三、直接在.vue文件中引入element中的组件
例如弹框:
<template>
<el-button type="text" @click="open" style="color:red;fontSize:30px;">点击where</el-button>
</template>
<script>
export default {
methods: {
open() {
this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$message({
type: 'success',
message: '删除成功!'
});
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
}
}
}
</script>
如图就是成功之后的内容

网友评论