element-ui的安装和使用，及在Vue项目中，查看当前正在使用的element-ui版本

一、引入element-ui的两种方式第一种方式：使用npm命令行安装npm i element-ui -S第二种方式：CDN直接获取最新资源二、查看当前Vue项目的element的版本我是用idea创建的Vue项目，在pack.json的dependencies中就可以直接查看...

gao_jun1

9123人浏览 · 2020-09-04 19:20:13

gao_jun1 · 2020-09-04 19:20:13 发布

一、引入element-ui的两种方式

第一种方式：使用npm命令行安装

npm i element-ui -S

在这里插入图片描述

第二种方式：CDN直接获取最新资源

在这里插入图片描述

二、element的使用

重要：在main.js中引入并使用

// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import router from './router'

/*element的依赖*/
/*引入下面三行*/
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);

Vue.config.productionTip = false

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  components: { App },
  template: '<App/>'
})

在项目中使用，直接在vue的文件中使用即可

在这里插入图片描述
具体的操作可参照官网：https://element.eleme.cn/#/zh-CN/component/container

三、查看当前Vue项目的element的版本

我是用idea创建的Vue项目，在pack.json的dependencies中就可以直接查看
在这里插入图片描述

参考文档：https://element.eleme.cn/#/zh-CN/component/container

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^