VUE的element-ui的使用
我们在自己的网站当中有的时候会用到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的使用的更多相关文章
- 关于vue.js element ui 表单验证 this.$refs[formName].validate()的问题
方法使用前需了解: 来自”和“小编的小提示: 首先打印一下this.$refs[formName],检查是否拿到了正确的需要验证的form. 其次在拿到了正确的form后,检查该form上添加 ...
- Vue框架Element UI教程-axios请求数据
Element UI手册:https://cloud.tencent.com/developer/doc/1270 中文文档:http://element-cn.eleme.io/#/zh-CN gi ...
- vue与element ui的el-checkbox的坑
一,场景 通过使用checkbox,实现如图的场景, 点击某个tag,实现选中和非选中状态. 二, 官网的例子 通过切换checked值为true或者false来实现,一个checkbox的状态切换 ...
- vue.js+element ui Table+spring boot增删改查
小白初学,不懂的还是太多了,找了好多资料才做出来的先记录一下 1.先用Spring boot创建一个包含了增删改查的项目 2.创建vue.js项目 3.安装Element UI (1)进入项目文件夹下 ...
- vue开源Element UI表单设计及代码生成器
在日常的开发工作中,表单开发是较为繁琐且重复的.本文介绍一个我自己写的,提高开发效率的小工具. 1 可视化设计器 设计器基于Element UI ,可通过点击或拖拽的方式设计基本表单, 设计器生成的代 ...
- 第五十三篇:Vue安装Element ui
好家伙,之前写的一篇过时了,用不了了,更新一波 (已新建一个vue项目) 1. 在项目目录下执行:npm i element-ui -S 2. 在main.js中写入 import ElementUI ...
- VUE -- 对 Element UI table中数据进行二次处理
时间——日期 后台经常给我们返回的是 时间戳 (例如:1535620671) 这时候我们页面展现的时候需要将时间戳转换为我们要的格式 例如 (YYYY-MM-DD HH:mm:ss) 如果是在Elem ...
- Vue.js + Element.ui 从搭建环境到打包部署
一.搭建环境 由于新的node已经集成了npm,所以直接安装node,前往node官网下载最新版本的node,根据自己的操作系统选择相应的包,按照步骤一步步走就可以,这里不做过多介绍. 安装好后可以打 ...
- vue基于 element ui 的按钮点击节流
vue的按钮点击节流 场景: 1.在实际使用中,当我们填写表单,点击按钮提交的时候,当接口没返回之前,迅速的点击几次,就会造成多次提交. 2.获取验证码,不频繁的获取. 3.弹幕不能频繁的发 基于这几 ...
- Vue结合Element UI实战
创建工程 1. 创建一个名为hello-vue的工程 vue init webpack hello-vue 2. 安装依赖 需要安装 vue-router.element-ui.sass-loader ...
随机推荐
- H5 + 3D + AR/VR 综述
近年来,H5,3D,AR,VR逐步进入人们的视野,H5生动活泼,3D注重视觉效果,AR打造虚实结合,VR则更加注重虚拟现实的产生. 第一部分,案例展示: H5+VR案例: 故事<不要惊慌,没有辐 ...
- 学习vue_01
目录 vue 框架: 框架介绍 基础格式 插值表达式: 文本指令: 事件指令: 属性指令: 小结: js 补充(面向对象): vue 框架: --构建虚拟的DOM结构,(内存内改变对象)- 操作数据的 ...
- vue中子组件的methods中获取到props中的值
这个官网很清楚,也很简单,父组件中使用v-bind绑定传送,子组件使用props接收即可 例如: 父组件中 <template> <div> <head-top>& ...
- 算法马拉松35 E 数论只会Gcd - 类欧几里得 - Stern-Brocot Tree - 莫比乌斯反演
题目传送门 传送门 这个官方题解除了讲了个结论,感觉啥都没说,不知道是因为我太菜了,还是因为它真的啥都没说. 如果 $x \geqslant y$,显然 gcd(x, y) 只会被调用一次. 否则考虑 ...
- (98)address already in use: ah00072: make_sock: could not bind to address 0.0.0.0:80
(98)address already in use: ah00072: make_sock: could not bind to address 0.0.0.0:80 问题描述: 80端口已经被占用 ...
- markdown文本内跳转
Markdown文本内跳转 构建茅的过程中使用markdown语法,类似于markdown向外跳转链接,目的地地址写成#. 在markdown文本中写入: 目录 跳转 跳转部分按照html文本的写法 ...
- SWIG 3 中文手册——1. 前言
目录 1 前言 1.1 引言 1.2 SWIG 版本 1.3 SWIG 许可证 1.4 SWIG 资源 1.5 前提要求 1.6 本手册的组织构成 1.7 如何避免阅读手册 1.8 向后兼容 1.9 ...
- CEF4Delphi初识
代码模块与职责 所有的代码都在src目录下,这会导致一上手的时候无法快速划分模块,不便于理解,如果分类然后放文件夹就会好一些. 最关键的部分在于uCEFApplication,是和dll链接的部分 u ...
- Docker安装及简单使用
1.docker安装 #1.检查内核版本,必须是3.10及以上 uname -r #2.安装 yum -y install docker 2.docker简单使用 #1.启动docker system ...
- React setState没有及时更新
1.封装 setFieldsValue 方法 /** * 更新state中的值 * data:{stateFieldName1:stateFieldvalue1...} */ setStateFiel ...