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

第三方组件库：element-uiiviewVant

news 来源：原创 2025/7/14 14:49:01

第三方组件库：element-ui

使用方法：
1.引入样式

<!-- 引入element-ui样式 --><link rel="stylesheet" type="text/css" href="http://unpkg.com/view-design/dist/styles/iview.css">

2.引入vue

<!-- 引入Vue --><script type="text/javascript" src="http://vuejs.org/js/vue.min.js"></script>

3.引入element-ui组件库

//注意：第三方组件库，必须在Vue的下面引入<!-- 引入element-ui组件库 --><script type="text/javascript" src="http://unpkg.com/view-design/dist/iview.min.js"></script>

4.找想要的样式组件
https://iview.github.io/docs/guide/install

5.复制代码到对应的.vue文件

6.修改对应的数据

<div id='app'><template><!-- 因为template里面只能有一个根元素，官方这里拷过来以后在外面加了一层div标签包起来 --><div><el-input-number v-model="num" @change="handleChange" :min="1" :max="10" label="描述文字"></el-input-number></div>  </template></div>

<script src='https://cdn.bootcdn.net/ajax/libs/vue/2.6.14/vue.js'></script><script>Vue.config.productionTip = falselet vm = new Vue({el: '#app',data() {return {//修改相应的数据num: 1};},computed: {},watch: {},methods: {},created() { },mounted() { },})</script>

第三方组件库：iview
使用方法：
1.引入样式

<!-- 引入element-ui样式 --><link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">

2.引入vue

<!-- 引入Vue --><script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.14/vue.js"></script>

3.引入element-ui组件库

//注意：第三方组件库，必须在Vue的下面引入<!-- 引入element-ui组件库 --><script src="https://unpkg.com/element-ui/lib/index.js"></script>

4.找想要的样式组件
https://element.eleme.io/#/zh-CN/component/installation

5.复制代码到对应的.vue文件

6.修改对应的数据

<div id='app'><template><!-- 因为template里面只能有一个根元素，官方这里拷过来以后在外面加了一层div标签包起来 --><div><!-- <Input v-model="value" placeholder="请输入..." style="width: 300px"></Input> --><!-- 注意：非 template/render 模式下，需使用 i-input --><i-input v-model="value" placeholder="请输入..." style="width: 300px"></Input></div></template></div>

<!-- 引入Vue --><script type="text/javascript" src="http://vuejs.org/js/vue.min.js"></script><!-- 引入iview --><script type="text/javascript" src="http://unpkg.com/view-design/dist/iview.min.js"></script><script>Vue.config.productionTip = falselet vm = new Vue({el: '#app',components: {},data() {return {value: ''};},computed: {},watch: {},methods: {},created() { },mounted() { },})</script>

第三方组件库：Vant
使用方法：
1.引入样式

<!-- 引入样式文件 --><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@2.12/lib/index.css" />

2.引入vue

<!-- 引入Vue --><script src="https://cdn.jsdelivr.net/npm/vue@2.6/dist/vue.min.js"></script>

3.引入vant组件库

//注意：第三方组件库，必须在Vue的下面引入<!-- 引入vant组件库 --><script src="https://cdn.jsdelivr.net/npm/vant@2.12/lib/vant.min.js"></script>

4.找想要的样式组件
https://youzan.github.io/vant-weapp/#/home

5.复制代码到对应的.vue文件

6.修改对应的数据

<div id="app"><van-button type="primary">主要按钮</van-button><van-cell-group><van-cell title="单元格" value="内容" /><van-cell title="单元格" value="内容" label="描述信息" /></van-cell-group><van-cell-group><van-field v-model="value" label="文本" placeholder="请输入用户名" /></van-cell-group></div>

<script src="https://cdn.jsdelivr.net/npm/vue@2.6/dist/vue.min.js"></script><script src="https://cdn.jsdelivr.net/npm/vant@2.12/lib/vant.min.js"></script><script>new Vue({el: '#app',data() {return {value:'123'}},})</script>

喜欢的朋友记得点赞、收藏、关注哦！！！

第三方组件库：element-uiiviewVant

第三方组件库：element-ui 使用方法： 1.引入样式 <link rel"stylesheet" type"text/css" href"http://unpkg.com/view-design/dist/styles/iview.css">2.引入vue <!-- 引入Vue …...

编程日记 2025/7/14 14:49:01

Qt实现 hello world + 内存泄漏（5)

文章目录实现hello world的两种方式通过图形化的方式通过纯代码的方式1. 新老头文件的说明2.堆或栈上创建对象的选择3.QString的说明内存泄漏问题实现hello world的两种方式通过图形化的方式通过图形化的方式，在界面上创建出一个控件，显示出hello …...

编程日记 2025/6/29 5:11:15

13：图像处理—畸变矫正详解

1.制作标定板和描述文件 （用PS软件打印） * 0.00375 mark 点间距 ， 不是点的直径//倒数第二个就是描述文件 gen_caltab(7,7,0.00375,0.5,caltab_30mm.descr,30-30.ps) * 1 比 1 打印。Photoshop 格式 2.把标定板调正调正的目的是为了…...

编程日记 2025/6/29 7:47:28

Prompt compress 技术探究-LLMLingua

Prompt summary：是通过精心设计的提示词（prompt）引导大型语言模型（如 GPT-4）生成特定风格或结构的摘要。其目标不仅是压缩信息，还包括满足特定的格式要求、风格偏好或任务需求，所以和一般的文本…...

编程日记 2025/6/29 8:40:27

Python|Pyppeteer实现自动登录小红书(32)

前言本文是该专栏的第32篇，结合优质项目案例持续分享Pyppeteer的干货知识，记得关注。本文中，笔者以小红书为例，基于Pyppeteer实现自动登录“小红书”。需要注意的是，对Pyppeteer不太熟悉的同学，可往前翻阅本专栏前面介绍的Pyppeteer知识点，本专栏将带你了解并熟练使…...

编程日记 2025/6/29 6:15:10

Milvus（13）：自定义分析器、过滤器

1 自定义分析器 1.1 标准标记符 Milvus 中的standard 令牌分割器根据空格和标点符号分割文本，适用于大多数语言。要配置使用standard 令牌转换器的分析器，请在analyzer_params 中将tokenizer 设置为standard 。 analyzer_params {"tokenizer&quo…...

编程日记 2025/6/29 8:08:15

调试Cortex-M85 MCU启动汇编和链接命令文件 - 解题一则

调试Cortex-M85 MCU启动汇编和链接命令文件 - 解题一则苏勇 Andrew, 2025-05 最近在Keil中调试一款新的Cortex-M85内核MCU的SDK代码时，从原有其它芯片的工程中引入了汇编语言编写的启动代码和配套的sct文件，结果总是报错，清理到最后&#…...

编程日记 2025/6/29 5:11:37

SpringMVC——第五章：视图View

一、SpringMVC中视图的实现原理 1.Spring MVC视图支持可配置在Spring MVC中，视图View是支持定制的，例如我们之前在 springmvc.xml 文件中进行了如下的配置：  <bean id"thymeleafViewResolver" class…...

编程日记 2025/6/29 5:24:55

【PostgreSQL数据分析实战：从数据清洗到可视化全流程】3.4 数据重复与去重（IDENTITY COLUMN/UNIQUE约束）

👉 点击关注不迷路 👉 点击关注不迷路 👉 点击关注不迷路文章大纲 PostgreSQL数据分析实战：数据质量分析之数据重复与去重（IDENTITY COLUMN/UNIQUE约束）3.4 数据重复与去重3.4.1 数据重复的影响与识别3.4.…...

编程日记 2025/7/10 20:31:19

数据分析之药物-基因-代谢物

记录一下最近的数据分析过程： 假如我有一个Dataframe，有两列[Drug, Gene]，我想构造一个矩阵，行名为Drug，列名为Gene，值为0或者1，其中0表示药物的靶点是该基因，0表示不是靶点。 &am…...

编程日记 2025/6/29 5:20:44

【PostgreSQL数据分析实战：从数据清洗到可视化全流程】3.2 缺失值检测与处理（NULL值填充/删除策略）

👉 点击关注不迷路 👉 点击关注不迷路 👉 点击关注不迷路文章大纲缺失值检测与处理全攻略：NULL值填充与删除策略实战3.2 缺失值检测与处理3.2.1 缺失值类型与业务影响3.2.1.1 缺失值的三种形态3.2.1.2 业务影响分级 3.2.2 缺失值…...

编程日记 2025/6/29 6:19:46

科普简洁版：同态加密——密码学的未来瑰宝

文章目录一、同态加密的基本概念1.1 什么是同态加密1.2 同态加密的数学本质1.3 同态加密的类型二、主要同态加密方案详解2.1 ElGamal加密2.2 Paillier加密2.3 Gentry的完全同态加密方案2.4 BGV方案2.5 BFV方案2.6 CKKS方案三、同态加密的关键技术3.1 噪声管理技术3.2 多项式…...

编程日记 2025/6/29 6:49:55

时序分解 | Matlab基于WOA-MVMD鲸鱼算法优化多元变分模态分解

时序分解 | Matlab基于WOA-MVMD鲸鱼算法优化多元变分模态分解目录时序分解 | Matlab基于WOA-MVMD鲸鱼算法优化多元变分模态分解效果一览基本介绍程序设计参考资料效果一览基本介绍 WOA-MVMD鲸鱼算法优化多元变分模态分解时间序列信号分解可直接运行分解效果好适合作为创…...

编程日记 2025/6/29 5:20:45

模型部署与提供服务

工具准备 FastApi (提供接口服务) LLamafactory(模型测试) AutoDL-SSH（隧道工具） 结构目录 app ├── api.sh ├── lawbot_infer.py ├── main.py ├── models.py ├── prompts │ ├── chat.jinja2 │ ├── prediction.jinja2 │…...

编程日记 2025/7/9 18:10:26

【Linux】深入理解程序地址空间

🌟🌟作者主页：ephemerals__ 🌟🌟所属专栏：Linux 目录前言一、什么是程序地址空间二、深入理解程序地址空间 1. 引例 2. 理解地址转化 3. 再谈程序地址空间 4. 补充知识总结前言在现代操作系…...

编程日记 2025/6/29 7:00:03

基于AWS Marketplace的快速解决方案：从选型到部署实战

1. 引言：为什么选择AWS Marketplace？ 在数字化转型的背景下，企业需要快速获取成熟的软件工具和服务以降低开发成本。AWS Marketplace 作为亚马逊云科技的官方应用商店，提供超过万款预配置的第三方和AWS原生解决方案，涵…...

编程日记 2025/7/8 1:57:55

一控件名称 TextView二示例代码 <?xml version="1.0" encoding="utf-8"?> <androidx.coordinatorlayout.widget.CoordinatorLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.a…...

编程日记 2025/6/29 6:08:32

ubuntu修改时区和设置24小时格式时间

这里写目录标题一、修改时区二、设置24小时格式时间endl 一、修改时区使用timedatectl命令更改当前时区为东八区[rootubuntu24-16:~]# timedatectl list-timezones | grep -i shanghai Asia/Shanghai [rootubuntu24-16:~]# timedatectl set-timezone Asia/Shanghai [rootubu…...

编程日记 2025/6/29 6:38:55

Android之Button、ImageButton、ChipGroup用法

一控件名称及UI代码 Button、ImageButton、ChipGroup <?xml version="1.0" encoding="utf-8"?> <androidx.coordinatorlayout.widget.CoordinatorLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:app=&qu…...

编程日记 2025/6/29 6:55:20

【中间件】brpc_基础_用户态线程中断

bthread之用户态线程中断源码 1 简介 interrupt_pthread 核心功能是通过信号机制中断阻塞的 pthread 线程，以实现线程的协作式中断。 2 核心功能与设计 2.1 信号选择与注册信号选择：使用 SIGURG 作为中断信号。原因：SIGURG 通常用于…...

编程日记 2025/6/29 5:11:16

MATLAB中tabulate函数——先验概率的简单估计

load fisheriris X meas(:,1:2); Y species; labels unique(Y); tabulate(Y)ValueCountPercentsetosa5033.33%versicolor5033.33%virginica5033.33%...

编程日记 2025/6/29 8:18:27

修复笔记：SkyReels-V2 项目中的 torch.load 警告

#工作记录一、问题描述在运行项目时，出现以下警告： FutureWarning: You are using torch.load with weights_onlyFalse (the current default value), which uses the default pickle module implicitly. It is possible to construct malicious pic…...

编程日记 2025/7/5 15:33:55

[特殊字符] 人工智能大模型之开源大语言模型汇总（国内外开源项目模型汇总） [特殊字符]

Large Language Model (LLM) 即大规模语言模型，是一种基于深度学习的自然语言处理模型，它能够学习到自然语言的语法和语义，从而可以生成人类可读的文本。所谓 "语言模型"，就是只用来处理语言文字（或者符号…...

编程日记 2025/6/29 6:07:52

自监督学习（Self-supervised Learning）李宏毅

目录 Self-supervised Learning简介： BERT : How to use BERT case1：sequence to class 语言积极性OR消极性判断 case2：sequence to sequence句子中的词语词性标注 case3：sequence2 to class两个句子是不是一个为前提一个为…...

编程日记 2025/6/29 7:18:27

数字化时代下，软件测试中的渗透测试是如何保障安全的？

在如今数字化与信息化的时代，软件测试中存在渗透测试，其位置十分重要，它借助模拟恶意攻击的方式，去发现软件系统所存在的漏洞以及安全问题，这是保障软件安全的关键环节，接下来我会对它的各个方面进行详细介…...

编程日记 2025/6/29 6:25:36

内容中台的AI中枢是什么？

智能算法与知识图谱融合引擎现代内容中台的核心竞争力在于智能算法与知识图谱的深度融合，这种技术组合构建了动态演化的认知网络。通过将机器学习模型与领域知识图谱进行耦合，系统不仅能识别文本、图像、视频等多模态数据的关联特征，还能实…...

编程日记 2025/6/29 5:11:46

PostgreSQL 的 REINDEX 命令

PostgreSQL 的 REINDEX 命令 REINDEX 是 PostgreSQL 中用于重建索引的重要命令，它可以解决索引损坏、索引膨胀或性能下降等问题。一 REINDEX 基本语法 -- 重建单个索引 REINDEX [ ( option [, ...] ) ] { INDEX | TABLE | SCHEMA } [ CONCURRENTLY ] name REIND…...

编程日记 2025/6/29 7:48:25

GNOME扩展:Bing壁纸

难点网络请求(Soup) 下载文件(Soup) 读写设置(Gio.Settings) 源码 import GLib from "gi://GLib"; import Gio from gi://Gio; import St from gi://St; import Soup from gi://Soup;import { Extension } from resource:///org/gnome/shell/extensions/extens…...

编程日记 2025/6/29 5:20:48

BUUCTF——Fake XML cookbook

BUUCTF——Fake XML cookbook 进入靶场只有一个登录框先弱口令万能密码试一下吧弱口令和万能密码都失败了找其他突破口 F12看看发现xml代码 function doLogin(){var username $("#username").val();var password $("#password").val();if(user…...

编程日记 2025/7/14 8:56:46

【数据结构】线性表--链表

【数据结构】线性表--链表一.前情回顾二.链表的概念三.链表的实现1.链表结点的结构：2.申请新结点函数：3.尾插函数：4.头插函数：5.尾删函数：6.头删函数：7.在指定结点之前插入：8.在指定结点之后插…...

编程日记 2025/6/29 6:26:36

2022年第十三届蓝桥杯省赛B组Java题解

2022年第十三届蓝桥杯省赛B组Java题解个人心得： 2022年蓝桥杯省赛Java B组共包含10道题目，其中填空题2道（A、B），编程题8道（C-J）。题目覆盖数论、字符串处理、动态规划、数据结构等核心知识点…...

编程日记 2025/6/29 5:42:06

【操作系统】死锁

1. 定义死锁是指两个或多个进程（或线程）在执行过程中，因争夺资源而造成的一种僵局，每个进程都无限期地等待其他进程释放它们所持有的资源。在这种情况下，没有任何进程能够继续执行，除非有外部干预。 2. …...

编程日记 2025/6/29 5:24:52

Ubuntu22.04及以上版本buildroot SIGSTKSZ 报错问题

本文提供一种解决 Buildroot SIGSTKSZ 报错途径解决途径来源参考：Buildroot error when building with Ubuntu 21.10 其出现原因在于 GNU C Library 2.34 release announcement： Add _SC_MINSIGSTKSZ and _SC_SIGSTKSZ. When _DYNAMIC_STACK_SIZE_SOU…...

编程日记 2025/6/29 6:45:58

postgresql数据库基本操作

1. 连接 PostgreSQL 数据库首先，使用 psql 命令行工具连接到数据库。如果是本地连接，命令格式如下： psql -U postgres -d <数据库名称> -h <主机地址>其中： -U postgres：表示以 postgres 用户身份登录…...

编程日记 2025/6/29 7:49:32

【运维】构建基于Python的自动化运维平台：用Flask和Celery打造高效管理工具

《Python OpenCV从菜鸟到高手》带你进入图像处理与计算机视觉的大门！解锁Python编程的无限可能：《奇妙的Python》带你漫游代码世界随着企业IT基础设施的复杂性不断增加，手动运维已无法满足高效管理的需求。本文详细介绍如何基于Python构建一个自动化运维平台，利用Flask…...

编程日记 2025/6/29 7:57:52

ES6入门---第三单元模块三：async、await

async function fn(){ //表示异步：这个函数里面有异步任务 let result await xxx //表示后面结果需要等待 } 读取文件里数据实例： const fs require(fs);//简单封装 fs封装成一个promise const readFile function (fileName){return…...

编程日记 2025/6/29 8:07:30

洛谷 P2866 [USACO06NOV] Bad Hair Day S

题目描述农夫约翰有 N 头奶牛正在过乱头发节。每一头牛都站在同一排面朝右，它们被从左到右依次编号为 1,2,⋯,N。编号为 i 的牛身高为 hi。第 N 头牛在最前面，而第 1 头牛在最后面。对于第 i 头牛前面的第 j 头牛，如果 hi>hi1…...

编程日记 2025/6/29 6:16:27

TS 变量类型生成

TS简单类型注解 let count:number 15 let myName:string MIO let isLoading:boolean false let a:null null let b:undefined undefined let s:symbol Symbol()console.log(hello ts)TS数组类型数组类型两种写法： 问题：数组中只能存在单一类型数…...

编程日记 2025/6/29 5:20:24

工业大模型：从设备诊断到工艺重构

引言工业大模型正在引发制造业认知革命。据埃森哲研究，到2026年全球工业大模型市场规模将突破280亿美元，其中工艺优化应用占比达42%。本文将系统解析工业大模型的"预训练-领域适配-应用落地"技术路径，并通过设备健康诊断与工艺参数生成的实践案例，展示如何构建…...

编程日记 2025/7/13 16:02:58

【项目篇之统一内存操作】仿照RabbitMQ模拟实现消息队列

我们的操作分为两种，一种是在内存上进行统一的操作，一种是在硬盘上面操作，今天我写的文章是编写了一个MemoryDataCenter类来实现了在内存上面的统一操作： 实现统一内存操作如何使用内存来组织数据创建一个类来统一管理内存上的…...

编程日记 2025/6/28 20:05:52

强化学习机器人模拟器——GridWorld：一个用于强化学习的 Python 环境

GridWorld 是一个为强化学习（Reinforcement Learning, RL）实验设计的多功能 Python 环境。它提供了一个可定制的二维网格，智能体（agent）需要从起始位置导航到目标位置，避开障碍物、穿越泥泞单元格并收集奖励。本篇博客将详细介绍 grid_world.py 代码中实现的 GridWorld 环…...

编程日记 2025/6/28 20:05:50

DeepSeek Copilot idea插件推荐

🌌 DeepSeek Copilot for IntelliJ IDEA 让 AI 成为你的编程副驾驶，极速生成单元测试 & 代码注释驱动开发！ 🚀 简介 DeepSeek Copilot 是一款为 IntelliJ IDEA 打造的 AI 编程助手插件，它能够智能分析你的代码逻辑…...

编程日记 2025/6/28 20:05:48

vue-cropper实现图片裁剪

一、什么是vue-cropper？ Vue-Cropper 是一个基于 Vue.js 的图片裁剪组件库，专为 Web 应用设计。当你在网上搜索的时候发现还有一个叫cropper的库，下面是他们的区别： 特性cropper.jsvue-cropper框架依赖纯 JavaScript&am…...

编程日记 2025/6/28 20:05:46

MPI，Pthreads和OpenMP等并行实验环境配置

（假设你已按照文档前面的步骤正确安装了 VMware 和 Ubuntu 20.04） 第一部分：安装 C/OpenMP/Pthreads 环境（修正后） 打开终端： 在 Ubuntu 中启动终端应用程序。更新软件包列表： sudo ap…...

编程日记 2025/6/28 20:05:44

Spring AI Advisors API：AI交互的灵活增强利器

Spring AI Advisors API：AI交互的灵活增强利器前言在当今的软件开发领域，随着人工智能技术的飞速发展，将AI融入应用程序变得越来越普遍。Spring AI作为一个强大的框架，为开发者提供了便捷的方式来实现这一目标。其中的Advisor…...

编程日记 2025/6/28 20:05:42

排序功法入门指南【江湖算法笔记】

话说江湖风云变幻，各路英雄好汉行走江湖，总得有个名号排行。若问“东邪西毒南帝北丐”谁强谁弱，总得排个座次不是？这排序之道，恰似武功秘籍，练好了能号令群雄，练岔了怕是要被笑掉大牙&#xff0…...

编程日记 2025/6/28 20:05:39

Free Draft Model！Lookahead Decoding加速大语言模型解码新路径

Free Draft Model！Lookahead Decoding加速大语言模型解码新路径大语言模型（LLMs）在当今AI领域大放异彩，但其自回归解码方式锁死了生成效率。本文将为你解读一种全新的解码算法——Lookahead Decoding，它无需Draft Mo…...

编程日记 2025/7/11 6:06:10

Spring AI 实战：第八章、Spring AI Tool Calling之与时俱进

引言：AI的"知识截止日期"尴尬如果你想问大模型"明天是星期几？"，猜猜TA会怎么答复你~ @GetMapping("/tools/simple/test") public String simpleTest() {return chatClient.prompt...

编程日记 2025/6/28 20:05:37

PyTorch数据集与数据集加载

PyTorch中的Dataset与DataLoader详解 1. Dataset基础 Dataset是PyTorch中表示数据集的抽象类，我们需要继承它并实现两个关键方法： from torch.utils.data import Datasetclass CustomDataset(Dataset):def __init__(self, data, labels):""…...

编程日记 2025/6/29 6:55:57

探秘 Git 底层原理：理解版本控制的基石

Git 是一款开源的分布式版本控制系统，在软件开发领域广泛应用，能有效管理项目的版本变更，Git 已经成为了版本控制的代名词。日常使用中，我们通过git commit提交代码，用git push推送变更，这些便捷操作背后&a…...

编程日记 2025/7/7 18:25:12

相关文章：