我们在自己的网站当中有的时候会用到element-ui的组建

1.如何安装element-ui的组件

在命令行工具当中输入cnpm i element-ui -S, 等待安装

2.如何在vue当中使用element-ui的组件

1.在main.js中引入element相关的js和css

import Vue from 'vue'

import ElementUI from 'element-ui'

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

import App from './App.vue'

Vue.use(ElementUI)

2.在.vue文件中加入element-ui的按钮之类的即可。

<template>
<div id="app">
<img src="./assets/logo.png">
<router-view/>
<el-button type="primary">主要按钮</el-button>
</div>
</template> <script>
export default {
name: 'app'
}
</script> <style scoped>
@import '../static/css/index.css';
</style>

 3.cnpm run dev运行即可看到相应的效果

VUE的element-ui的使用的更多相关文章

  1. 关于vue.js element ui 表单验证 this.$refs[formName].validate()的问题

        方法使用前需了解: 来自”和“小编的小提示: 首先打印一下this.$refs[formName],检查是否拿到了正确的需要验证的form. 其次在拿到了正确的form后,检查该form上添加 ...

  2. Vue框架Element UI教程-axios请求数据

    Element UI手册:https://cloud.tencent.com/developer/doc/1270 中文文档:http://element-cn.eleme.io/#/zh-CN gi ...

  3. vue与element ui的el-checkbox的坑

    一,场景 通过使用checkbox,实现如图的场景, 点击某个tag,实现选中和非选中状态. 二, 官网的例子 通过切换checked值为true或者false来实现,一个checkbox的状态切换 ...

  4. vue.js+element ui Table+spring boot增删改查

    小白初学,不懂的还是太多了,找了好多资料才做出来的先记录一下 1.先用Spring boot创建一个包含了增删改查的项目 2.创建vue.js项目 3.安装Element UI (1)进入项目文件夹下 ...

  5. vue开源Element UI表单设计及代码生成器

    在日常的开发工作中,表单开发是较为繁琐且重复的.本文介绍一个我自己写的,提高开发效率的小工具. 1 可视化设计器 设计器基于Element UI ,可通过点击或拖拽的方式设计基本表单, 设计器生成的代 ...

  6. 第五十三篇:Vue安装Element ui

    好家伙,之前写的一篇过时了,用不了了,更新一波 (已新建一个vue项目) 1. 在项目目录下执行:npm i element-ui -S 2. 在main.js中写入 import ElementUI ...

  7. VUE -- 对 Element UI table中数据进行二次处理

    时间——日期 后台经常给我们返回的是 时间戳 (例如:1535620671) 这时候我们页面展现的时候需要将时间戳转换为我们要的格式 例如 (YYYY-MM-DD HH:mm:ss) 如果是在Elem ...

  8. Vue.js + Element.ui 从搭建环境到打包部署

    一.搭建环境 由于新的node已经集成了npm,所以直接安装node,前往node官网下载最新版本的node,根据自己的操作系统选择相应的包,按照步骤一步步走就可以,这里不做过多介绍. 安装好后可以打 ...

  9. vue基于 element ui 的按钮点击节流

    vue的按钮点击节流 场景: 1.在实际使用中,当我们填写表单,点击按钮提交的时候,当接口没返回之前,迅速的点击几次,就会造成多次提交. 2.获取验证码,不频繁的获取. 3.弹幕不能频繁的发 基于这几 ...

  10. Vue结合Element UI实战

    创建工程 1. 创建一个名为hello-vue的工程 vue init webpack hello-vue 2. 安装依赖 需要安装 vue-router.element-ui.sass-loader ...

随机推荐

  1. CSP-S2019游记 执枪的人,一定要做好被杀的觉悟。

    啊,大概是人生中最镇定的三天了. 是了. Day0 教练超级巨,给了我们电话说出去要散养,有事别慌,打电话.身份证丢了别慌,打电话.火车误了别慌,打电话... 然后去了就路上颓颓颓.然后过去试机,打了 ...

  2. 【转】HTTPS 如何保证数据传输的安全性?

    大家都知道,在客户端与服务器数据传输的过程中,HTTP协议的传输是不安全的,也就是一般情况下HTTP是明文传输的.但HTTPS协议的数据传输是安全的,也就是说HTTPS数据的传输是经过加密的. 在客户 ...

  3. Cobalt环境搭建及 Web开发注意事项

    一.在Linux系统上搭建Cobalt运行环境 Cobalt是一款开源轻量级HTML5/CSS/JS浏览器,旨在于用最少的CPU.GPU.RAM等资源消耗提供丰富的应用程序开发.为了使前端开发者验证自 ...

  4. 使用windows 上的远程连接来远程Linux Ubuntu系统的设置

    实验环境: Windows 10 , VMware Workstation ,Ubuntu16.04 1.root登录ubuntu,然后执行下面的命令 # root账户登录ubuntu ,执行下面的命 ...

  5. SQL ------------ avg() 与 sum 函数

    AVG() 函数返回数字列的平均值 注意是数字的平均数, 语法: select avg(字段) from 表名 建个表,弄点数据 使用 select avg(字段) as 平均数 from 表名 与w ...

  6. ConcurrentHashMap 源码分析,基于JDK1.8

    1:几个重要的成员变量: private static final int MAXIMUM_CAPACITY = 1 << 30; //map 容器的最大容量 private static ...

  7. springboot指定注解扫描范围

    springboot注解扫描范围是由@ComponentScan指定的;默认情况下为启动程序所在目录及其子包; 如果需要指定扫描路径,在启动程序中添加修改 @ComponentScan(basePac ...

  8. Python '\r', '\n', '\r\n' 的彻底理解

    回车和换行的历史: 机械打字机有回车和换行两个键作用分别是: 换行就是把滚筒卷一格,不改变水平位置.   (即移到下一行,但不是行首,而是和上一行水平位置一样) 回车就是把水平位置复位,不卷动滚筒.  ...

  9. Mybatis系列(一)— 处理冲突字符

    在Mybatis的配置文件中编写SQL经常会遇到字符冲突问题 where或者having中使用"<"过滤,Mybatis xml解析器将其当做配置的开始标签处理: " ...

  10. Git更改文件名大小写,提交失败问题解决

    背景:某java文件大小写写错了,一直提交不上去 例如我只是将updatePrivacySettingsTest.java变更为UpdatePrivacySettingsTest.java,但是add ...