Vue使用element-ui

  1. main.js配置
//引入Vue
import Vue from 'vue'
//引入App
import App from './App.vue'//完整引入
//引入ElementUI组件库
// import ElementUI from 'element-ui';
//引入ElementUI全部样式
// import 'element-ui/lib/theme-chalk/index.css';//按需引入
import { Button,Row,DatePicker } from 'element-ui';//关闭Vue的生产提示
Vue.config.productionTip = false//应用ElementUI
// Vue.use(ElementUI);
Vue.component('atguigu-button', Button);
Vue.component('atguigu-row', Row);
Vue.component('atguigu-date-picker', DatePicker);//创建vm
new Vue({el:'#app',render: h => h(App),
})
  1. 使用
<template><div><button>原生的按钮</button><input type="text"><atguigu-row><el-button>默认按钮</el-button><el-button type="primary">主要按钮</el-button><el-button type="success">成功按钮</el-button><el-button type="info">信息按钮</el-button><el-button type="warning">警告按钮</el-button><el-button type="danger">危险按钮</el-button></atguigu-row><atguigu-date-pickertype="date"placeholder="选择日期"></atguigu-date-picker><atguigu-row><el-button icon="el-icon-search" circle></el-button><el-button type="primary" icon="el-icon-s-check" circle></el-button><el-button type="success" icon="el-icon-check" circle></el-button><el-button type="info" icon="el-icon-message" circle></el-button><el-button type="warning" icon="el-icon-star-off" circle></el-button><el-button type="danger" icon="el-icon-delete" circle></el-button></atguigu-row></div>
</template><script>export default {name:'App',}
</script>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/40261.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

记一次前端直接上传图片到oss报错

前端直接上传图片到阿里云oss,相关过程官网和网上资料已经很详细&#xff0c;不做赘述。 但这个过程比较复杂&#xff0c;前后端对接过程中很容易出现报错&#xff0c;这里遇到了以下报错&#xff0c;不容易排查。 请求显示net::ERR_NAME_NOT_RESOLVED错误&#xff0c;catch输…

如何在windows电脑安装多个tomcat服务器和乱码问题

前提条件安装jdk 以17版本为例&#xff0c;将jdk8卸载干净 1.首先进入tomcat官网下载 tomcat网址 这里下载tomcat10为例子 1.1 这里选择方式一 下载解压版 2.解压后拷贝三份 分别命名为 8081、 8082、 8083 3.分别对每个tomcat执行以下操作 3.1 找到tomcat所在webapps文…

Flask框架-配置日志(1):flask使用日志

一、项目结构 study_flask --| apps/ --| __init__.py --| base/ --| logger.py --| __init__.py --| app.py 二、配置日志功能 1、base/logger.py import os import logging from datetime import datetime,date,timedelta from logging.handlers import RotatingFileHandl…

python 开启5个进程处理list数据

要在 Python 中开启多个进程来处理列表数据&#xff0c;你可以使用 multiprocessing 模块。下面是一个开启5个进程处理列表数据的示例代码&#xff1a; python import multiprocessingdef process_item(item):# 在这里处理每个列表项的逻辑print(f"Processing item: {ite…

LeetCode[56]合并区间

难度&#xff1a;Medium 题目&#xff1a; 以数组 intervals 表示若干个区间的集合&#xff0c;其中单个区间为 intervals[i] [starti, endi] 。请你合并所有重叠的区间&#xff0c;并返回 一个不重叠的区间数组&#xff0c;该数组需恰好覆盖输入中的所有区间 。 示例 1&…

Android Studio Giraffe控制台乱码

这几天在使用Android Studio Giraffe进行一个App的开发&#xff0c;在项目构建的时候&#xff0c;控制台输出中文都是乱码&#xff0c;看着很不爽&#xff0c;进行了两项配置&#xff0c;中文就可以正常输出了&#xff0c;看起来就爽多了。 第一个配置&#xff1a;点击Help菜单…

Redis对象和五种常用数据类型

Redisobject 对象 对象分为键对象和值对象 键对象一般是string类型 值对象可以是string&#xff0c;list&#xff0c;set,zset,hash q&#xff1a;redisobj的结构 typedef struct redisObject { //类型 unsigned type:4; //编码 unsigned encoding:4; //指向底层实现…

webrtc Thread 和 TaskQueue 的 应用和思考

webrtc Thread 和 TaskQueue 的 应用和思考 Thread #include "rtc_base/thread.h"void FunctionToRunOnThread() {// Your threaded logic here.printf("Function running on the thread!\n"); }int main() {rtc::Thread* thread rtc::Thread::Create()…

WebService—XFire配置笔记

在学习之前,一直以为WebService就是一个工具,在两个服务器之间建立一个通信,帮我们把需要传输的数据组织成规范的XML数据并发送到目的地,实际情况也确实是这样的,不过更高级一点的是,XFire不但可以帮我们生成XML发送,而且可以在接收了xml之后还可以直接返回对象给我们用…

iptabels路由转发

要配置iptables进行路由转发&#xff0c;需要执行以下步骤&#xff1a; 确保系统已经开启了IP转发功能。可以通过执行以下命令来检查&#xff1a; sysctl net.ipv4.ip_forward如果返回的值为1&#xff0c;表示已经开启了IP转发功能。如果返回的值为0&#xff0c;可以通过执行…

神经网络基础-神经网络补充概念-29-为什么使用深层表示

概念 深层表示&#xff08;Deep Representation&#xff09;是指在深度神经网络的多个隐藏层中逐层提取和学习数据的特征表示。 使用深层表示的原因 高维特征提取&#xff1a;深层神经网络可以从原始数据中自动学习高维抽象特征。每个隐藏层都对数据进行一些变换&#xff0c…

“深入探索JVM内部机制:解密Java虚拟机的奥秘“

标题&#xff1a;深入探索JVM内部机制&#xff1a;解密Java虚拟机的奥秘 摘要&#xff1a;本文将深入探索Java虚拟机&#xff08;JVM&#xff09;的内部机制&#xff0c;介绍JVM的基本原理、运行时数据区域以及垃圾回收机制&#xff0c;并通过示例代码解释这些概念。 正文&am…

PG-DBA培训14:PostgreSQL数据库升级与迁移

一、风哥PG-DBA培训14&#xff1a;PostgreSQL数据库升级与迁移 课程目标&#xff1a; 本课程由风哥发布的基于PostgreSQL数据库的系列课程&#xff0c;本课程属于PostgreSQL备份恢复与迁移升级阶段之PostgreSQL数据库升级与迁移&#xff0c;学完本课程可以PostgreSQL数据库升…

炒股票怎么加杠杆_融资融券账户怎么开通

炒股票作为一种投资方式&#xff0c;可以带来不错的回报。然而&#xff0c;对于那些希望以较小的资金获得更高收益的投资者来说&#xff0c;加杠杆炒股票是一个值得考虑的选择。本文将为您介绍加杠杆炒股票的意义&#xff0c;以及如何开通融资融券账户。 加杠杆炒股票的意义&a…

Centos8安装docker并配置Kali Linux图形化界面

鉴于目前网上没有完整的好用的docker安装kali桌面连接的教程&#xff0c;所以我想做一个。 准备工作 麻了&#xff0c;这服务器供应商提供的镜像是真的纯净&#xff0c;纯净到啥都没有。 问题一&#xff1a;Centos8源有问题 Error: Failed to download metadata for repo ap…

vue入门(增查改!)

<template><div><!-- 搜索栏 --><el-card id"search"><el-row><el-col :span"20"><el-input v-model"searchModel.name" placeholder"根据名字查询"></el-input><el-input v-mode…

STM32 FLASH 读写数据

1. 《STM32 中文参考手册》&#xff0c;需要查看芯片数据手册&#xff0c;代码起始地址一般都是0x8000 0000&#xff0c;这是存放整个项目代码的起始地址 2. 编译信息查看代码大小&#xff0c;修改代码后第一次编译后会有这个提示信息 2.1 修改代码后编译&#xff0c;会有提示…

python3.73安装教程,python3.10安装教程

大家好&#xff0c;小编来为大家解答以下问题&#xff0c;python3.73安装教程&#xff0c;python3.10安装教程&#xff0c;现在让我们一起来看看吧&#xff01; Python目前已支持所有主流操作系统&#xff0c;在Linux,Unix,Mac系统上自带Python环境&#xff0c;一般默认装的是P…

你敢信?代码小白30min就能搭建一套酷炫级的驾驶舱!

大量研究结果表明&#xff0c;人类通过图像获取信息的速度比通过阅读文字获取信息的速度要快很多。 近几年&#xff0c;数据可视化在企业中越发“流行”&#xff0c;将数字以可视化的形式展示&#xff0c;不仅清晰明了地展现企业真正的实力&#xff0c;也能让管理者快速了解细节…

PG-DBA培训12:PostgreSQL物理备份与恢复实战

一、风哥PG-DBA培训12&#xff1a;PostgreSQL物理备份与恢复实战 课程目标&#xff1a; 本课程由风哥发布的基于PostgreSQL数据库的系列课程&#xff0c;本课程属于PostgreSQL备份恢复与迁移升级阶段之PostgreSQL物理备份与恢复实战&#xff0c;学完本课程可以掌握&#xff1…