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

vue3 axios ant-design-vue cdn的方式使用

news 2026/1/23 8:04:06

1、vue3

快速上手 | Vue.js

<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script><div id="app">{{ message }}</div><script>const { createApp, ref } = VuecreateApp({setup() {const message = ref('Hello vue!')return {message}}}).mount('#app')
</script>

2、ant-design-vue 4.2.3

<script src="https://unpkg.com/vue@3.4.27/dist/vue.global.prod.js"></script><script src="https://unpkg.com/dayjs/dayjs.min.js"></script><script src="https://unpkg.com/dayjs/plugin/customParseFormat.js"></script><script src="https://unpkg.com/dayjs/plugin/weekday.js"></script><script src="https://unpkg.com/dayjs/plugin/localeData.js"></script><script src="https://unpkg.com/dayjs/plugin/weekOfYear.js"></script><script src="https://unpkg.com/dayjs/plugin/weekYear.js"></script><script src="https://unpkg.com/dayjs/plugin/advancedFormat.js"></script><script src="https://unpkg.com/dayjs/plugin/quarterOfYear.js"></script><link type="text/css" href="https://unpkg.com/ant-design-vue@4.2.3/dist/reset.css" media="screen" rel="stylesheet"><script src="https://unpkg.com/ant-design-vue@4.2.3/dist/antd.min.js"></script><script src="https://unpkg.com/axios/dist/axios.min.js"></script>
import { DatePicker } from 'ant-design-vue';
app.use(DatePicker);

3、template

<body class="bg"><div id="app"></div>
</body>
<script>Object.assign(window, Vue);const vue3App = {setup() {const msg = ref(''); //信息onMounted(() => {console.log(window.location.search);});function test() {// 发送 POST 请求axios({method: 'post',url: '/url换成自己的',data: {code: '0',message: 'success',type: 'opt',result: 'success',uid: uid.value,msgid: msgid.value,}}).then(function (response) {console.log(response);msg.value = response.data.message;}).catch(function (error) {console.log(error);});}// 返回值会暴露给模板和其他的选项式 API 钩子return {msg,btnClick() {//console.log(msg.value);test();},}},}//初始化const app = createApp(vue3App);app.use(antd);app.mount("#app");</script><style>.bg {background-color: rgb(213, 213, 213);}.margintop {margin-top: 300px;}.marginbottom {margin-bottom: 30px;}</style>

相关文章：

vue3 axios ant-design-vue cdn的方式使用

1、vue3 快速上手 | Vue.js <script src"https://unpkg.com/vue3/dist/vue.global.js"></script><div id"app">{{ message }}</div><script>const { createApp, ref } VuecreateApp({setup() {const message ref(Hello …...

编程日记 2024/9/21 4:53:54

neo4j导入csv数据

neo4j数据可视化实践 手动输入数据 - 官方democsv数据导入准备数据数据处理导入步骤① 导入疾病表格② 导入药物表格③导入疾病-药物关系表格 爬虫的csv文件 手动输入数据 - 官方demo 点击之后&#xff0c;按照左边10张图中的代码&#xff0c;复制粘贴熟悉语法 效果如下 csv数据…...

编程日记 2024/9/21 4:52:52

YOLOV8实现小目标检测

YOLOV8小目标检测 前言&#xff1a;&#xff1a; yolo版出现很多&#xff0c;基本大同小异 但是这些差异让我们考虑在实验中使用哪个版本会比较好&#xff01; 在对小目标检测的过程中&#xff0c;yolov7相比yolov8性能更加好。 如果我们还是想使用yolov8&#xff0c;也是可以实…...

编程日记 2024/9/21 4:51:51

解决 Prettier ESLint 错误

解决 Prettier ESLint 错误 在 Vue.js 项目中使用 ESLint 和 Prettier 时&#xff0c;你可能会遇到类似以下的错误&#xff1a; frontend\src\views\dashboard\MobileConfigPanel.vue1:25 error Delete ␍ …...

编程日记 2024/9/21 4:50:50

百度网盘企业版数据快速上云，数据流转平台 CloudFlow 加速大模型训练迭代

1 项目从何时开始&#xff0c;又是何时结束 一个项目的周期应该如何计算&#xff0c;将计算开始运行作为起点&#xff0c;计算结束运行作为终点&#xff1f; 大模型训练场景中&#xff0c;从 TB/PB 级数据完成收集准备上云&#xff0c;到这些数据被提交至任务开始运行&#x…...

编程日记 2024/9/21 4:48:48

地面站通过SSH连接无人机

地面站通过SSH连接无人机 1.启动SSH服务2.远程连接到无人机处理器 一般无人机机载处理器都安装了ssh服务器 1.启动SSH服务 启动SSH sudo systemctl start ssh设置为开机自启动 sudo systemctl enable ssh检查ssh服务状态 sudo systemctl status ssh查询无人机的ip ifconf…...

编程日记 2024/9/21 4:47:47

【Pytorch】大语言模型中的CrossEntropyLoss

文章目录 前言什么是CrossEntropyLoss语言模型中的CrossEntropyLoss计算loss的前期准备CrossEntropyLoss的输入CrossEntropyLoss的输出 额外说明 前言 在大语言模型时代&#xff0c;我们常常使用交叉熵损失函数来计算loss&#xff0c;因此&#xff0c;理解该loss的计算流程有助…...

编程日记 2024/9/21 4:46:45

安全热点问题

安全热点问题 1.DDOS2.补丁管理3.堡垒机管理4.加密机管理 1.DDOS 分布式拒绝服务攻击&#xff0c;是指黑客通过控制由多个肉鸡或服务器组成的僵尸网络&#xff0c;向目标发送大量看似合法的请求&#xff0c;从而占用大量网络资源使网络瘫痪&#xff0c;阻止用户对网络资源的正…...

编程日记 2024/9/21 4:45:45

C++——用选择法对10个数值进行排序。

没注释的源代码 #include <iostream> using namespace std; int main() { int i,j,min,a[11],temp; cout<<"请输入数组a的十个值&#xff1a;"<<endl; for(i1;i<10;i) { cin>>a[i]; } for(i1;i<9;…...

编程日记 2024/9/21 4:44:44

CSP-CCF★★★201909-2小明种苹果（续）★★★

一、问题描述 二、解答 关键&#xff1a;判断是否发生苹果掉落&#xff0c;使用flag[]数组来标记&#xff0c;1为掉落&#xff0c;0为没有掉落&#xff0c;这样也是为了后续比较连续三棵树是否掉落 误区&#xff1a;用最后一次正数&#xff08;即最后一次统计苹果个数&#x…...

编程日记 2024/9/21 4:43:43

硬件工程师笔试面试——变压器

目录 9、变压器 9.1 基础 变压器原理图 变压器实物图 9.1.1 概念 9.1.2 变压器组成结构 9.1.3 变压器原理 9.1.4 变压器的类型 9.1.5 应用领域 9.2 相关问题 9.2.1 变压器的工作原理是什么? 9.2.2 如何选择合适的变压器类型? 9.2.3 变压器在实际应用中，如何进行…...

编程日记 2024/9/21 4:40:39

Visual Studio Code（ VS Code）倍速提高编程工作效率的免费的源代码编辑器

耕耘于编程二十多年&#xff0c;后端、前端、操作系统、数据库、脚本都做过&#xff0c;各种各样的编程工具&#xff0c;IDE开发环境都用过&#xff0c;但是让我感觉比较好用、容易上手、能够提高工作效率的开发工具还是VS Code&#xff0c;下面我就简单的介绍一下这个广泛使用…...

编程日记 2024/9/21 4:37:36

华为SMU02B1智能通信电源监控单元模块简介

华为SMU02B1是一款智能通信电源监控单元模块&#xff0c;专为5G嵌入式机框设计&#xff0c;它在通信电源管理领域扮演着重要角色。以下是对该产品的详细介绍&#xff1a; 一、产品概述 主要功能&#xff1a;华为SMU02B1能够监控和管理通信电源系统&#xff0c;提供站点监控功能…...

编程日记 2024/9/21 4:36:36

【刷题日记】15. 三数之和

15. 三数之和 两数之和可以用巧思也可以用map 三数之和会更加复杂一点&#xff0c;且这道题还需要考虑避免重复答案&#xff01; 思路&#xff1a; 特判&#xff1a;检如果nums 为 null 或长度小于 3直接返回空数组。排序&#xff1a;使用 sort对数组进行升序排序。就变成了…...

编程日记 2024/9/21 4:35:35

低级编程语言和高级编程语言

一.区分低级编程语言和高级编程语言的方法 1.低级编程语言 低级编程语言,并不是简单的编程语言,而是写起来很费事的编程语言,如所有编程语言的"祖宗":汇编语言,写起来极其麻烦,说不定一个 int a1; 它就得写好几行,甚至十几行 这样麻烦的编程语言为什么还没消失那,因…...

编程日记 2024/9/21 4:34:34

Spring Boot-API网关问题

****### Spring Boot API 网关问题分析与解决方案 在微服务架构中&#xff0c;API 网关扮演着非常重要的角色。它位于客户端和微服务之间&#xff0c;充当所有外部请求的入口&#xff0c;负责请求的路由、聚合、鉴权、限流等功能。Spring Boot 提供了多种方式实现 API 网关&am…...

编程日记 2024/9/21 4:32:32

三 auto占位符

3.1 重新定义的auto关键字 1.当用一个auto关键字声明多个变量的时候&#xff0c;编译器遵从由左往右的推导规则&#xff0c;以最左边的表达式推断auto的具体类型 int n 5; auto *pn &n, m 10;// 这里auto被推导为 int 所以int m 10;合理 auto *pns &n, m 10.0;/…...

编程日记 2024/9/21 4:31:31

tail: inotify 资源耗尽

解决方法&#xff1a; 增加可用的 inotify 监视器数量。可以通过修改系统配置文件来增加监视器数量限制。 临时增加&#xff08;直到下次重启&#xff09;&#xff1a;执行 echo 1048576 | sudo tee -a /proc/sys/fs/inotify/max_user_instances 和 echo 65536 | sudo tee -a /…...

编程日记 2024/9/21 4:29:29

什么是损失函数？常见的损失函数有哪些？

损失函数 什么是损失函数&#xff1f;损失函数作用如何设计损失函数常见的损失函数有哪些&#xff1f; 什么是损失函数&#xff1f; 损失函数&#xff08;Loss Function&#xff09;&#xff0c;也称为误差函数&#xff0c;是机器学习和深度学习中的一个重要概念。它用于衡量模…...

编程日记 2024/9/21 4:28:27

Python Web 开发中的国际化与本地化处理

Python Web 开发中的国际化与本地化处理 目录 &#x1f30d; Flask中的国际化与本地化处理&#x1f310; Django中的国际化与本地化处理&#x1f5e3;️ 多语言支持与翻译系统实现&#x1f552; 时区和日期的本地化处理 1. &#x1f30d; Flask中的国际化与本地化处理 Flask…...

编程日记 2024/9/21 4:27:25

设计模式和设计原则回顾

设计模式和设计原则回顾 23种设计模式是设计原则的完美体现，设计原则设计原则是设计模式的理论基石， 设计模式 在经典的设计模式分类中（如《设计模式：可复用面向对象软件的基础》一书中），总共有23种设计模式，分为三大类： 一、创建型模式（5种） 1. 单例模式（Sing…...

编程新知 2025/12/14 20:57:41

（十）学生端搭建

本次旨在将之前的已完成的部分功能进行拼装到学生端&#xff0c;同时完善学生端的构建。本次工作主要包括&#xff1a; 1.学生端整体界面布局 2.模拟考场与部分个人画像流程的串联 3.整体学生端逻辑 一、学生端 在主界面可以选择自己的用户角色 选择学生则进入学生登录界面…...

编程新知 2026/1/20 20:23:33

k8s从入门到放弃之Ingress七层负载

k8s从入门到放弃之Ingress七层负载 在Kubernetes&#xff08;简称K8s&#xff09;中&#xff0c;Ingress是一个API对象&#xff0c;它允许你定义如何从集群外部访问集群内部的服务。Ingress可以提供负载均衡、SSL终结和基于名称的虚拟主机等功能。通过Ingress&#xff0c;你可…...

编程新知 2025/9/7 0:12:53

【快手拥抱开源】通过快手团队开源的 KwaiCoder-AutoThink-preview 解锁大语言模型的潜力

引言&#xff1a; 在人工智能快速发展的浪潮中&#xff0c;快手Kwaipilot团队推出的 KwaiCoder-AutoThink-preview 具有里程碑意义——这是首个公开的AutoThink大语言模型&#xff08;LLM&#xff09;。该模型代表着该领域的重大突破&#xff0c;通过独特方式融合思考与非思考…...

编程新知 2026/1/15 10:59:06

【ROS】Nav2源码之nav2_behavior_tree-行为树节点列表

1、行为树节点分类 在 Nav2（Navigation2）的行为树框架中，行为树节点插件按照功能分为 Action（动作节点）、Condition（条件节点）、Control（控制节点） 和 Decorator（装饰节点） 四类。 1.1 动作节点 Action 执行具体的机器人操作或任务，直接与硬件、传感器或外部系统…...

编程新知 2026/1/21 5:34:33

《通信之道——从微积分到 5G》读书总结

第1章 绪 论 1.1 这是一本什么样的书 通信技术&#xff0c;说到底就是数学。 那些最基础、最本质的部分。 1.2 什么是通信 通信 发送方 接收方 承载信息的信号 解调出其中承载的信息 信息在发送方那里被加工成信号&#xff08;调制&#xff09; 把信息从信号中抽取出来&am…...

编程新知 2026/1/20 23:41:27

华为OD机试-食堂供餐-二分法

import java.util.Arrays; import java.util.Scanner;public class DemoTest3 {public static void main(String[] args) {Scanner in new Scanner(System.in);// 注意 hasNext 和 hasNextLine 的区别while (in.hasNextLine()) { // 注意 while 处理多个 caseint a in.nextIn…...

编程新知 2026/1/15 7:06:11

Java多线程实现之Thread类深度解析

Java多线程实现之Thread类深度解析 一、多线程基础概念1.1 什么是线程1.2 多线程的优势1.3 Java多线程模型 二、Thread类的基本结构与构造函数2.1 Thread类的继承关系2.2 构造函数 三、创建和启动线程3.1 继承Thread类创建线程3.2 实现Runnable接口创建线程 四、Thread类的核心…...

编程新知 2025/8/28 21:52:02

08. C#入门系列【类的基本概念】：开启编程世界的奇妙冒险

C#入门系列【类的基本概念】&#xff1a;开启编程世界的奇妙冒险 嘿&#xff0c;各位编程小白探险家&#xff01;欢迎来到 C# 的奇幻大陆&#xff01;今天咱们要深入探索这片大陆上至关重要的 “建筑”—— 类&#xff01;别害怕&#xff0c;跟着我&#xff0c;保准让你轻松搞…...

编程新知 2025/10/31 20:37:10

宇树科技，改名了！

提到国内具身智能和机器人领域的代表企业&#xff0c;那宇树科技&#xff08;Unitree&#xff09;必须名列其榜。 最近&#xff0c;宇树科技的一项新变动消息在业界引发了不少关注和讨论&#xff0c;即&#xff1a; 宇树向其合作伙伴发布了一封公司名称变更函称&#xff0c;因…...

编程新知 2026/1/15 5:30:41