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

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

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 …...

neo4j导入csv数据

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

YOLOV8实现小目标检测

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

解决 Prettier ESLint 错误

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

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

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

地面站通过SSH连接无人机

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

【Pytorch】大语言模型中的CrossEntropyLoss

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

安全热点问题

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

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;…...

CSP-CCF★★★201909-2小明种苹果(续)★★★

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

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

目录 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 变压器在实际应用中,如何进行…...

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

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

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

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

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

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

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

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

Spring Boot-API网关问题

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

三 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;/…...

tail: inotify 资源耗尽

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

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

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

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

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

Redis分布式锁进阶第二十篇

一、本篇前置衔接 第二十篇我们完成了全系列终局复盘&#xff0c;整理了故障排查SOP与企业级落地铁律。常规单资源锁、热点分片锁、隔离锁全部讲透&#xff0c;但真实复杂业务永远不是单一资源&#xff1a;下单要扣库存、扣优惠券、扣积分、冻结余额&#xff0c;多资源并行争抢…...

鸿蒙系统微博应用锁常见问题解答

为微博设置应用锁后&#xff0c;不少用户会有各种疑问&#xff1a;忘记密码怎么办&#xff1f;会不会影响消息推送&#xff1f;能不能只锁定某些功能&#xff1f;应用锁耗电吗&#xff1f;本文将针对这些高频问题逐一解答&#xff0c;帮助您更好地使用鸿蒙系统&#xff08;Harm…...

举一个具体例子说明为什么索引不是越多越好,举具体字段

文章目录1. 核心舞台&#xff1a;笔记表 (t_note) 结构设计&#x1f6a8; 错误的操作&#xff1a;2. 结合具体字段&#xff0c;拆解三大翻车现场现场一&#xff1a;给 view_count&#xff08;浏览量&#xff09;加索引 —— 导致写放大&#xff0c;拖垮数据库现场二&#xff1a…...

【C语言】C 语言为什么叫 C 语言呢?

【C语言】C 语言为什么叫 C 语言呢&#xff1f;笔记改自于王道训练营资料 其实是因为先有高级语言ALGOL 60&#xff0c;简称 A 语言&#xff0c;后来经过简化&#xff0c;变为 BCPL 语言&#xff0c;简称 B 语言&#xff0c;而 C 语言是在 B 语言的基础之上发展而来的&#xff…...

通用物联网开发板设计:基于ESP8266的硬件集成与开发实践

1. 项目概述&#xff1a;为什么我们需要一块“通用”的物联网开发板&#xff1f;在捣鼓了几年物联网项目之后&#xff0c;我发现自己桌面上堆满了各种开发板&#xff1a;ESP8266、ESP32、Arduino Uno、STM32 Nucleo……每个项目都要重新连线、配置电源、焊接传感器接口&#xf…...

Redis 客户端连接详解

Redis 客户端连接详解 引言 Redis 是一款高性能的内存数据结构存储系统,常用于缓存、会话管理、实时排行榜等功能。客户端连接是 Redis 生态系统中的重要组成部分,本文将详细介绍 Redis 客户端连接的相关知识,包括连接方式、连接配置、连接管理等方面。 Redis 客户端连接…...

不止于绘图:用GMT 6.4的`grdtrack`和`project`命令玩转地形剖面分析与可视化

不止于绘图&#xff1a;用GMT 6.4的grdtrack和project命令玩转地形剖面分析与可视化 当我们谈论地理空间分析时&#xff0c;很多人首先想到的是绘制精美的地图。但GMT&#xff08;Generic Mapping Tools&#xff09;的真正魅力在于它强大的地理计算能力。本文将带你超越基础绘图…...

为什么你的DeepSeek总漏检重构后代码?4步反混淆预处理法(附LLM辅助去装饰器Python脚本)

更多请点击&#xff1a; https://codechina.net 第一章&#xff1a;DeepSeek代码重复检测 DeepSeek-R1 模型在训练过程中引入了严格的代码去重机制&#xff0c;其核心目标是消除训练语料中语义等价或高度相似的代码片段&#xff0c;从而提升模型对真实编程模式的学习能力与泛化…...

10.刷机变砖、IMEI 丢失、基带未知、触控失灵?一站式终极修复方案

摘要 本文面向具备基础计算机操作能力的维修从业者与高级用户,系统讲解当前主流品牌手机(华为、小米、OPPO、vivo、一加、苹果)的刷机与维修核心流程。内容涵盖底层引导架构差异、Fastboot/Recovery/DFU模式操作规范、分区表保护策略、驱动兼容性处理以及常见硬件故障的软件…...

从无人机到自动驾驶:一文读懂ROS中ENU、NED、相机坐标系到底怎么用

从无人机到自动驾驶&#xff1a;ROS中ENU、NED与相机坐标系实战指南 当你在无人机上安装Realsense相机时&#xff0c;是否遇到过相机数据与飞控数据"对不上"的情况&#xff1f;或者在自动驾驶项目中&#xff0c;GPS的北东地坐标如何与激光雷达的东北天坐标对齐&#…...