当前位置: 首页 > news >正文

Vue篇-07

Vue UI组件库

一、移动端常用的UI组件库

1.1、Vant

1.2、Cube UI

1.3、Mint UI

二、PC端常用的UI组件库

2.1、Element UI

Element - The world's most popular Vue UI framework

安装:

按需引入:

135_尚硅谷Vue技术_element-ui按需引入_哔哩哔哩_bilibili

main.js

//引入Vue
import Vue from "vue";
//引入App
import App from './App';
//完整引入
//引入element-ui组件库
// import ElementUI from 'element-ui';
//引入element全部样式
// import 'element-ui/lib/theme-chalk/index.css';//使用element ui插件库
// Vue.use(ElementUI);//按需引入
import { Button, Input, Row, DatePicker } from 'element-ui';
Vue.use(Button);
Vue.use(Input);
Vue.use(Row);
Vue.use(DatePicker);//关闭Vue的生产提示
Vue.config.productionTip = false;new Vue({el: '#app',render: h => h(App),
});

 App.vue

<template><div><button>原生的button</button><input type="text"><el-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></el-row><div class="block"><span class="demonstration">默认</span><el-date-pickertype="date"placeholder="选择日期"></el-date-picker></div><el-row><el-button icon="el-icon-search" circle></el-button><el-button type="primary" icon="el-icon-edit" 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></el-row></div>
</template><script>
export default {name: "App",
}
</script>
<style lang="css" scoped></style>

2.2、IView UI

相关文章:

Vue篇-07

Vue UI组件库 一、移动端常用的UI组件库 1.1、Vant 1.2、Cube UI 1.3、Mint UI 二、PC端常用的UI组件库 2.1、Element UI Element - The worlds most popular Vue UI framework 安装&#xff1a; 按需引入&#xff1a; 135_尚硅谷Vue技术_element-ui按需引入_哔哩哔哩_b…...

使用 LLaMA-Factory 微调大模型

本文将介绍如下内容&#xff1a; 一、搭建 Docker Container 环境二、配置大模型训练环境三、构建、配置数据集四、训练大模型 一、搭建 Docker Container 环境 笔者此前多篇文章说明&#xff0c;此处不再赘述&#xff0c;可参考&#xff1a;NGC容器中快速搭建Jupyter环境 E…...

数据仓库的复用性:模型层面通用指标体系、参数化模型、版本化管理

在数据仓库设计中&#xff0c;复用性 是一个关键原则&#xff0c;它不仅能提升数据资产的使用效率&#xff0c;还能降低开发成本、优化系统运维。下面将从 模型层面的复用性、通用指标体系、参数化模型、版本化管理 四个方面进行详细介绍&#xff0c;并提供可落地的设计方案。 …...

Web APP 阶段性综述

Web APP 阶段性综述 当前&#xff0c;Web APP 主要应用于电脑端&#xff0c;常被用于部署数据分析、机器学习及深度学习等高算力需求的任务。在医学与生物信息学领域&#xff0c;Web APP 扮演着重要角色。在生物信息学领域&#xff0c;诸多工具以 Web APP 的形式呈现&#xff…...

某国际大型超市电商销售数据分析和可视化

完整源码项目包获取→点击文章末尾名片&#xff01; 本作品将从人、货、场三个维度&#xff0c;即客户维度、产品维度、区域维度&#xff08;补充时间维度与其他维度&#xff09;对某国际大型超市的销售情况进行数据分析和可视化报告展示&#xff0c;从而为该超市在弄清用户消费…...

电子杂志制作平台哪个好

​作为一个热爱分享的人&#xff0c;我试过了好几个平台&#xff0c;终于找到了几款比较好用得电子杂志制作平台&#xff0c;都是操作界面很简洁&#xff0c;上手非常快的工具。 FLBOOK:这是一款在线制作H5电子画册软件&#xff0c;提供了各种类型的模板&#xff0c;可支持添加…...

Django Admin 实战:实现 ECS 集群批量同步功能

引言 在管理大规模 AWS ECS (Elastic Container Service) 集群时,保持本地数据库与 AWS 实际状态的同步是一项关键任务。手动更新既耗时又容易出错,因此自动化这个过程变得尤为重要。本文将介绍如何利用 Django Admin 的自定义动作功能来实现 ECS 集群的批量同步操作,从而大…...

虚拟拨号技术(GOIP|VOIP)【基于IP的语音传输转换给不法分子的境外来电披上一层外衣】: Voice over Internet Protocol

文章目录 引言I 虚拟拨号技术(GOIP|VOIP)原理特性:隐蔽性和欺骗性II “GOIP”设备原理主要功能III 基于IP的语音传输 “VOIP” (Voice over Internet Protocol)IV “断卡行动”“断卡行动”目的电信运营商为打击电诈的工作V 知识扩展虚拟号保护隐私虚拟运营商被用于拨打骚扰…...

迅为RK3576开发板Android 多屏显示

迅为iTOP-3576开发板采用瑞芯微RK3576高性能、低功耗的应用处理芯片&#xff0c;集成了4个Cortex-A72和4个Cortex-A53核心&#xff0c;以及独立的NEON协处理器。它适用于ARM PC、边缘计算、个人移动互联网设备及其他多媒体产品。 1.1 Android 多屏同显 iTOP-RK3576 开发板支持…...

cmake + vscode + mingw 开发环境配置

1.软件准备 准备如下软件&#xff1a; mingw64&#xff08;安装完成之后检测是否有环境变量&#xff0c;如果没有需要配置&#xff09; cmake&#xff08;安装完成之后检测是否有环境变量&#xff0c;如果没有需要配置&#xff09; vscode&#xff08;安装CMake插件&#xff0…...

nginx 配置代理,根据 不同的请求头进行转发至不同的代理

解决场景&#xff1a;下载发票的版式文件&#xff0c;第三方返回的是url链接地址&#xff0c;但是服务是部署在内网环境&#xff0c;无法访问互联网进行下载。此时需要进行走反向代理出去&#xff0c;如果按照已有套路&#xff0c;就是根据不同的访问前缀&#xff0c;跳转不同的…...

类模板的使用方法

目录 类模板的使用方法 1.类模板语法 2.类模板和函数模板区别 3.类模板中成员函数创建时机 4.类函数对象做函数参数 5.类模板和继承 6.类模板成员函数类外实现 7.类模板分文件编写 person.hpp 实现cpp文件&#xff1a; 8.类模板与友元 9.类模板案例 MyArray.hpp …...

高级Python Web开发:FastAPI的前后端集成与API性能优化

高级Python Web开发&#xff1a;FastAPI的前后端集成与API性能优化 目录 &#x1f6e0;️ 前后端集成的基本原理与实践&#x1f680; FastAPI的API设计与实现&#x1f4c8; API性能测试与负载测试 &#x1f4ca; 使用Locust进行API性能测试&#x1f4a5; 使用Apache JMeter进…...

期权懂|期权的溢价率和杠杆率有什么区别?

锦鲤三三每日分享期权知识&#xff0c;帮助期权新手及时有效地掌握即市趋势与新资讯&#xff01; 期权的溢价率和杠杆率有什么区别&#xff1f; 一、定义篇 期权溢价率&#xff1a;这是一个细腻地描绘了期权价格与其内在价值之间微妙差异的指标。想象一下&#xff0c;期权价格就…...

分布式ID的实现方案

1. 什么是分布式ID ​ 对于低访问量的系统来说&#xff0c;无需对数据库进行分库分表&#xff0c;单库单表完全可以应对&#xff0c;但是随着系统访问量的上升&#xff0c;单表单库的访问压力逐渐增大&#xff0c;这时候就需要采用分库分表的方案&#xff0c;来缓解压力。 ​…...

Py之cv2:cv2(OpenCV,opencv-python)库的简介、安装、使用方法(常见函数、图像基本运算等)

1. OpenCV简介 1.1 OpenCV定义与功能 OpenCV&#xff08;Open Source Computer Vision Library&#xff09;是一个开源的计算机视觉和机器学习软件库。它为计算机视觉应用程序提供了一个通用的基础设施&#xff0c;并加速了在商业产品中使用机器感知。作为BSD许可的产品&…...

如何学习网络安全?有哪些小窍门?

学好网络安全其实没有所谓的捷径&#xff0c;也没有什么小窍门。 入门网络安全首先要有浓厚的学习兴趣&#xff0c;不然很容易就变成了从入门到放弃了。 其次要能静下心&#xff0c;踏踏实实的打好基础。如果你是零基础&#xff0c;建议从Web安全入手&#xff0c;课程难度相对…...

Dart语言的数据结构

Dart语言中的数据结构探讨 引言 Dart是一种现代化的编程语言&#xff0c;主要用于构建移动应用、Web应用和服务端应用。随着应用程序的复杂性日益增加&#xff0c;选择合适的数据结构显得尤为重要。数据结构不仅影响程序的性能&#xff0c;也影响程序的可维护性和可扩展性。本…...

TabPFN - 表格数据基础模型

文章目录 一、关于 TabPFN&#x1f310;TabPFN生态系统 二、快速入门&#x1f3c1;1、安装2、基本用法 三、使用技巧&#x1f4a1;四、开发&#x1f6e0;️1、设置环境2、在提交之前3、运行测试 一、关于 TabPFN TabPFN是表格数据的基础模型&#xff0c;它优于传统方法&#x…...

AOF日志:宕机了Redis如何避免数据丢失?

文章目录 AOF 日志是如何实现的&#xff1f;三种写回策略日志文件太大了怎么办&#xff1f;AOF 重写会阻塞吗?小结每课一问 更多redis相关知识 如果有人问你&#xff1a;“你会把 Redis 用在什么业务场景下&#xff1f;”我想你大概率会说&#xff1a;“我会把它当作缓存使用&…...

3个关键功能解析:USBToolBox如何简化macOS与Windows的USB端口映射难题

3个关键功能解析&#xff1a;USBToolBox如何简化macOS与Windows的USB端口映射难题 【免费下载链接】tool the USBToolBox tool 项目地址: https://gitcode.com/gh_mirrors/too/tool 在Hackintosh和跨平台开发领域&#xff0c;USB端口映射一直是个令人头疼的技术难题。US…...

Veo 2提示词效能跃迁实战(工业级Prompt链构建全图谱)

更多请点击&#xff1a; https://codechina.net 第一章&#xff1a;Veo 2提示词编写的核心范式演进 Veo 2作为新一代视频生成模型&#xff0c;其提示词&#xff08;prompt&#xff09;工程已从早期的“关键词堆叠”转向结构化、语义分层与意图对齐的复合范式。这一演进并非简…...

机器学习赋能6G近场通信:从信道估计到波束赋形的智能革命

1. 项目概述&#xff1a;当6G遇见近场&#xff0c;为何机器学习成为破局关键&#xff1f;如果你关注过5G到6G的技术演进路线&#xff0c;会发现一个核心趋势&#xff1a;天线阵列的规模正在从“大规模”走向“极大规模”。这不仅仅是数量的堆砌&#xff0c;更是通信物理原理的一…...

AArch64内存管理:MAIR_EL3寄存器详解与应用

1. AArch64内存管理基础与MAIR_EL3寄存器定位 在Armv8-A/v9-A架构中&#xff0c;内存管理单元(MMU)通过多级页表实现虚拟地址到物理地址的转换。当处理器执行内存访问时&#xff0c;MMU会遍历页表条目(Translation Table Entry)&#xff0c;其中包含两个关键信息&#xff1a;目…...

微信小程序3D开发框架技术对比:XR-Frame与threejs-miniprogram

随着微信小程序逐步支持3D渲染与AR能力&#xff0c;开发者面临两个主要官方方案&#xff1a;自研的XR-Frame和适配Three.js的threejs-miniprogram。本文将从架构设计、渲染机制、功能集成、开发模式及适用场景等维度进行技术分析&#xff0c;为技术选型提供参考。一、XR-Frame&…...

2026论文降AI怎么挑?亲测好用工具附免费降AI指南

“您的论文AIGC率为42%&#xff0c;超出学校30%的合格线&#xff0c;请修改后重新提交。”赶毕业论文的同学这段时间估计没少收到这样的提醒。2026年知网、万方、维普等主流平台的AI检测算法持续迭代&#xff0c;把AI生成内容改到符合学校要求&#xff0c;已经成了毕业生的刚需…...

长期使用Token Plan套餐在项目开发中的成本观察

&#x1f680; 告别海外账号与网络限制&#xff01;稳定直连全球优质大模型&#xff0c;限时半价接入中。 &#x1f449; 点击领取海量免费额度 长期使用Token Plan套餐在项目开发中的成本观察 在AI驱动的项目开发中&#xff0c;成本控制与预算管理是团队负责人必须面对的现实…...

差分隐私GDP机制紧密度量化:从隐私剖面到∆度量的实践指南

1. 差分隐私GDP机制&#xff1a;从理论到实践&#xff0c;如何量化隐私保护紧密度在差分隐私&#xff08;Differential Privacy, DP&#xff09;的实际部署中&#xff0c;尤其是在机器学习的隐私保护训练&#xff08;如DP-SGD&#xff09;场景里&#xff0c;我们常常面临一个核…...

defx.nvim 安装与配置完全教程:从零开始搭建高效文件管理系统 [特殊字符]

defx.nvim 安装与配置完全教程&#xff1a;从零开始搭建高效文件管理系统 &#x1f680; 【免费下载链接】defx.nvim :file_folder: The dark powered file explorer implementation for neovim/Vim8 项目地址: https://gitcode.com/gh_mirrors/de/defx.nvim defx.nvim …...

用图神经网络做缺陷定位,准确率比传统方法高出30%

在现代软件工程的复杂迷宫中&#xff0c;缺陷定位始终是测试团队面临的核心挑战。想象这样一个场景&#xff1a;一个电商系统在特定压力条件下偶发订单丢失&#xff0c;日志中只留下泛泛的超时错误&#xff0c;问题可能深藏在上百个微服务的调用链、分布式事务的竞态条件或某个…...