当前位置: 首页 > 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…...

【网络】每天掌握一个Linux命令 - iftop

在Linux系统中&#xff0c;iftop是网络管理的得力助手&#xff0c;能实时监控网络流量、连接情况等&#xff0c;帮助排查网络异常。接下来从多方面详细介绍它。 目录 【网络】每天掌握一个Linux命令 - iftop工具概述安装方式核心功能基础用法进阶操作实战案例面试题场景生产场景…...

调用支付宝接口响应40004 SYSTEM_ERROR问题排查

在对接支付宝API的时候&#xff0c;遇到了一些问题&#xff0c;记录一下排查过程。 Body:{"datadigital_fincloud_generalsaas_face_certify_initialize_response":{"msg":"Business Failed","code":"40004","sub_msg…...

Java - Mysql数据类型对应

Mysql数据类型java数据类型备注整型INT/INTEGERint / java.lang.Integer–BIGINTlong/java.lang.Long–––浮点型FLOATfloat/java.lang.FloatDOUBLEdouble/java.lang.Double–DECIMAL/NUMERICjava.math.BigDecimal字符串型CHARjava.lang.String固定长度字符串VARCHARjava.lang…...

力扣-35.搜索插入位置

题目描述 给定一个排序数组和一个目标值&#xff0c;在数组中找到目标值&#xff0c;并返回其索引。如果目标值不存在于数组中&#xff0c;返回它将会被按顺序插入的位置。 请必须使用时间复杂度为 O(log n) 的算法。 class Solution {public int searchInsert(int[] nums, …...

uniapp 开发ios, xcode 提交app store connect 和 testflight内测

uniapp 中配置 配置manifest 文档&#xff1a;manifest.json 应用配置 | uni-app官网 hbuilderx中本地打包 下载IOS最新SDK 开发环境 | uni小程序SDK hbulderx 版本号&#xff1a;4.66 对应的sdk版本 4.66 两者必须一致 本地打包的资源导入到SDK 导入资源 | uni小程序SDK …...

jmeter聚合报告中参数详解

sample、average、min、max、90%line、95%line,99%line、Error错误率、吞吐量Thoughput、KB/sec每秒传输的数据量 sample&#xff08;样本数&#xff09; 表示测试中发送的请求数量&#xff0c;即测试执行了多少次请求。 单位&#xff0c;以个或者次数表示。 示例&#xff1a;…...

在 Spring Boot 中使用 JSP

jsp&#xff1f; 好多年没用了。重新整一下 还费了点时间&#xff0c;记录一下。 项目结构&#xff1a; pom: <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi"http://ww…...

Kafka主题运维全指南:从基础配置到故障处理

#作者&#xff1a;张桐瑞 文章目录 主题日常管理1. 修改主题分区。2. 修改主题级别参数。3. 变更副本数。4. 修改主题限速。5.主题分区迁移。6. 常见主题错误处理常见错误1&#xff1a;主题删除失败。常见错误2&#xff1a;__consumer_offsets占用太多的磁盘。 主题日常管理 …...

渗透实战PortSwigger靶场:lab13存储型DOM XSS详解

进来是需要留言的&#xff0c;先用做简单的 html 标签测试 发现面的</h1>不见了 数据包中找到了一个loadCommentsWithVulnerableEscapeHtml.js 他是把用户输入的<>进行 html 编码&#xff0c;输入的<>当成字符串处理回显到页面中&#xff0c;看来只是把用户输…...

Python训练营-Day26-函数专题1:函数定义与参数

题目1&#xff1a;计算圆的面积 任务&#xff1a; 编写一个名为 calculate_circle_area 的函数&#xff0c;该函数接收圆的半径 radius 作为参数&#xff0c;并返回圆的面积。圆的面积 π * radius (可以使用 math.pi 作为 π 的值)要求&#xff1a;函数接收一个位置参数 radi…...