web开发 之 HTML、CSS、JavaScript、以及JavaScript的高级框架Vue（学习版2）
一、前言
接下来就是来解决这些问题
二、 Ajax
1.ajax
javscript是网页三剑客之一，空用来控制网页的行为的
xml是一种标记语言，是用来存储数据的
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>ajax-原生方式</title>
</head>
<body><input type="button" value="获取数据" onclick="getData()"><div id="div1"></div>
</body>
<script>function getData(){//1.创建XMLHttpRequest对象var xmlHttpRequest = new XMLhttpRequest();//2.发送异步请求xmlHttpRequest.open('GET','http://yapi.smart-xwork.cn/mock/169327/emp/list');xmlHttpRequest.send();//发送请求//3.获取服务响应数据xmlHttpRequest.onreadystatechange = function(){if(xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200){document.getElementById('div1').innerHTML = xmlHttpRequest.responseText;}}}
</script>
</html>‘
2.axios
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>ajax-axios</title>
</head>
<body><input type="button" value="获取数据GET" onclick="get()"><input type="button" value="删除数据POST" onclick="post()">
</body>
<script>function get(){axios({method:'get',url:'http://yapi.smart-xwork.cn/mock/169327/emp/list',}).then(result =>{console.log(result.data);})} function post(){axios({method:'post',url:'http://yapi.smart-xwork.cn/mock/169327/emp/deleteById',data:'id=1', }).then(result =>{console.log(result.data);})}
</script>
</html>
3.axio案例
这三个代码都是没有用浏览器看到的（因为那个网址打不开）
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>ajax-axios案例</title>
</head>
<body><div id="app"><table width="800px" cellspacing="0" border="1"><tr><th>编号</th><th>姓名</th><th>图片</th><th>性别</th><th>职位</th><th>入职时间</th><th>更新时间</th></tr><tr v-for="(emp, index) in emps" align="center"><td>{{index+1}}</td><td>{{emps.name}}</td><!-- <td>{{emps.image}}</td> --><td><img v-bind : src="emps.image" alt="" height="50px" width="70px"></td><td><span v-if="gender == 1">男</span><span v-if="gender == 2">女</span></td><td>{{emps.job}}</td><td>{{emps.entrydate}}</td><td>{{emps.updatatime}}</td></tr></table></div></body>
<script>new Vue({el:'a#pp',data:{emps:[]},mounted() {axios.get('').then(result => {this.emps = result.data.data;//当前vue实例中的data中的emps属性赋值})},})
</script>
</html>三、前后端分离开发
1.介绍
2.YAPI -接口文档管理平台
这里我插播一条：使用apipost
四、前端工程化
1.环境准备
如果需要可以找我要
2. vue项目介绍
3.vue项目开发流程
五、Vue组件库Element
六、Vue路由
七、打包部署
相关文章：
web开发 之 HTML、CSS、JavaScript、以及JavaScript的高级框架Vue（学习版2）
一、前言 接下来就是来解决这些问题 二、 Ajax 1.ajax javscript是网页三剑客之一，空用来控制网页的行为的 xml是一种标记语言，是用来存储数据的 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-…...
【课程学习】信号检测与估计II
b站 文章目录 1-概述 1-概述 线性、正交、平稳、高斯 研究线性模型，采用正交化方法，假设信号平稳，考虑信号的统计特性是高斯的。 本学期考虑，非线性、非正交、非平稳、非高斯。 阵列处理 1980-1990 MUSIC 稀疏性 2006-2012 LASS 时…...
【深度学习|PyTorch】基于 PyTorch 搭建 U-Net 深度学习语义分割模型——附代码及其解释！
【深度学习|PyTorch】基于 PyTorch 搭建 U-Net 深度学习语义分割模型——附代码及其解释！ 【深度学习|PyTorch】基于 PyTorch 搭建 U-Net 深度学习语义分割模型——附代码及其解释！ 论文地址： https://arxiv.org/abs/1505.04597 代码地址&a…...
DPDK基础入门（十）：虚拟化
I/O虚拟化 全虚拟化：宿主机截获客户机对I/O设备的访问请求，然后通过软件模拟真实的硬件。这种方式对客户机而言非常透明，无需考虑底层硬件的情况，不需要修改操作系统。 半虚拟化：通过前端驱动/后端驱动模拟实现I/O虚拟…...
OpenCV_图像旋转超详细讲解
图像转置 transpose(src, dst); transpose()可以实现像素下标的x和y轴坐标进行对调：dst(i,j)src(j,i)，接口形式 transpose(InputArray src, // 输入图像OutputArray dst, // 输出 ) 图像翻转 flip(src, dst, 1); flip()函数可以实现对图像的水平翻转…...
关于 OceanBase 4.x 中被truncate的 table 不再支持进回收站的原因
近期，OceanBase的问答社区中收到了不少用户的询问，关于OceanBase 3.x版本支持被truncate的table进入回收站的功能，为何在升级到4.x版本后不再支持了？为了解答大家的疑惑，我们将通过这篇文章来浅析 OceanBase在4.x版本中…...
Numpy索引详解（数值索引，列表索引，布尔索引）
数值索引 数值索引类似列表索引操作使用[]，参数为下标，[0,len-1),高维数组的索引使用多个[]连用分别代表一维索引，二维索引... import numpy as np import torchnp.random.seed(1) data1 np.arange(5) data2 np.arange(15).reshape(3,5) …...
大数据新视界 --大数据大厂之MongoDB与大数据：灵活文档数据库的应用场景
💖💖💖亲爱的朋友们，热烈欢迎你们来到 青云交的博客！能与你们在此邂逅，我满心欢喜，深感无比荣幸。在这个瞬息万变的时代，我们每个人都在苦苦追寻一处能让心灵安然栖息的港湾。而 我的…...
三年 Sparker 都不一定知道的算子内幕
一、如何在 mapPartitions 中释放资源 mapPartitions是一种对每个分区进行操作的转换操作，于常用的map操作类似，但它处理的是整个分区而不是单个元素。mapPartitions的应用场景适合处理需要在每个分区内批量处理数据的场景，通常用于优化性能…...
PG表空间
目录标题 PG表空间PostgreSQL表空间的最佳实践是什么？如何在PostgreSQL中创建和管理自定义表空间？PostgreSQL表空间对数据库性能的具体影响有哪些？在PostgreSQL中，如何迁移数据到不同的表空间以优化存储布局？PostgreSQ…...
谷粒商城のElasticsearch
文章目录 前言一、前置知识1、Elasticsearch 的结构2、倒排索引 (Inverted Index)2.1、 索引阶段2.2、查询阶段 二、环境准备1、安装Es2、安装Kibana3、安装 ik 分词器 三、项目整合1、引入依赖2、整合业务2.1、创建索引、文档、构建查询语句2.2、整合业务代码 后记 前言 本篇介…...
排队免单模式小程序开发
开发一个排队免单模式的小程序涉及多个方面，包括需求分析、界面设计、后端开发、数据库设计以及测试上线等。下面我将详细介绍每个步骤的概要： 1.需求分析 明确目标：首先确定小程序的核心功能，即排队免单模式的具体实现方式。例如…...
从OracleCloudWorld和财报看Oracle的转变
2024年9月9-12日Oracle Cloud World在美国拉斯维加斯盛大开幕 押注AI和云 Oracle 创始人Larry Ellison做了对Oracle战略和未来愿景的主旨演讲，在演讲中Larry将AI技术和云战略推到了前所未有的高度，从新的Oracle 23c改名到Oracle23ai，到Oracl…...
搭建 PHP
快速搭建 PHP 环境指南 PHP 是一种广泛用于 Web 开发的后端脚本语言，因其灵活性和易用性而受到开发者的青睐。无论是开发个人项目还是企业级应用，PHP 环境的搭建都是一个不可忽视的基础步骤。本指南将带您快速学习如何在不同平台上搭建 PHP 环境&#x…...
kubernetes技术详解，带你深入了解k8s
目录 一、Kubernetes简介 1.1 容器编排应用 1.2 Kubernetes简介 1.3 k8s的设计架构 1.3.1 k8s各个组件的用途 1.3.2 k8s各组件之间的调用关系 1.3.3 k8s的常用名词概念 1.3.4 k8s的分层结构 二、k8s集群环境搭建 2.1 k8s中容器的管理方式 2.2 k8s环境部署 2.2.1 禁用…...
Gateway学习笔记
目录 介绍： 核心概念 依赖 路由 断言 基本的断言工厂 自定义断言 过滤器 路由过滤器 过滤器工厂 自定义路由过滤器 全局过滤器 其他 过滤器执行顺序 前置后置（？） 跨域问题 yaml 解决 配置类解决 介绍&#x…...
创造增强叙事的互动：Allison Crank的沉浸式体验设计理念
在沉浸式技术日新月异的今天，如何通过用户交互增强叙事，而非分散注意力，成为了设计师们共同面临的挑战。作为用户体验设计师和研究员，Allison Crank以其独特的视角和丰富的经验，为我们揭示了这一领域的核心原则与实践方法。 叙事与互动的和谐共生 Allison Crank强调，互…...
Requests-HTML模块怎样安装和使用？
要安装和使用Requests-HTML模块，您可以按照以下步骤进行操作： 打开命令行界面（如Windows的命令提示符或Mac的终端）。 使用pip命令安装Requests-HTML模块。在命令行中输入以下命令并按回车键执行： pip install request…...
[网络]从零开始的计算机网络基础知识讲解
一、本次教程的目的 本次教程我只会带大叫了解网络的基础知识，了解网络请求的基本原理，为后面文章中可能会用到网络知识做铺垫。本次我们只会接触到网络相关的应用层，并不涉及协议的具体实现和数据转发的规则。也就是说，这篇教程是…...
wifiip地址可以随便改吗？wifi的ip地址怎么改变
对于普通用户来说，WiFi IP地址的管理和修改往往显得神秘而复杂。本文旨在深入探讨WiFi IP地址是否可以随意更改，以及如何正确地改变WiFi的IP地址。虎观代理小二将详细解释WiFi IP地址的基本概念、作用以及更改时需要注意的事项，帮助用户更好地…...
2025年能源电力系统与流体力学国际会议 (EPSFD 2025)
2025年能源电力系统与流体力学国际会议（EPSFD 2025）将于本年度在美丽的杭州盛大召开。作为全球能源、电力系统以及流体力学领域的顶级盛会，EPSFD 2025旨在为来自世界各地的科学家、工程师和研究人员提供一个展示最新研究成果、分享实践经验及…...
系统设计 --- MongoDB亿级数据查询优化策略
系统设计 --- MongoDB亿级数据查询分表策略 背景Solution --- 分表 背景 使用audit log实现Audi Trail功能 Audit Trail范围: 六个月数据量: 每秒5-7条audi log，共计7千万 – 1亿条数据需要实现全文检索按照时间倒序因为license问题，不能使用ELK只能使用…...
[10-3]软件I2C读写MPU6050 江协科技学习笔记（16个知识点）
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16...
UR 协作机器人「三剑客」：精密轻量担当（UR7e）、全能协作主力（UR12e）、重型任务专家（UR15）
UR协作机器人正以其卓越性能在现代制造业自动化中扮演重要角色。UR7e、UR12e和UR15通过创新技术和精准设计满足了不同行业的多样化需求。其中，UR15以其速度、精度及人工智能准备能力成为自动化领域的重要突破。UR7e和UR12e则在负载规格和市场定位上不断优化…...
企业如何增强终端安全？
在数字化转型加速的今天，企业的业务运行越来越依赖于终端设备。从员工的笔记本电脑、智能手机，到工厂里的物联网设备、智能传感器，这些终端构成了企业与外部世界连接的 “神经末梢”。然而，随着远程办公的常态化和设备接入的爆炸式…...
sipsak：SIP瑞士军刀！全参数详细教程！Kali Linux教程！
简介 sipsak 是一个面向会话初始协议 (SIP) 应用程序开发人员和管理员的小型命令行工具。它可以用于对 SIP 应用程序和设备进行一些简单的测试。 sipsak 是一款 SIP 压力和诊断实用程序。它通过 sip-uri 向服务器发送 SIP 请求，并检查收到的响应。它以以下模式之一…...
Python基于历史模拟方法实现投资组合风险管理的VaR与ES模型项目实战
说明：这是一个机器学习实战项目（附带数据代码文档），如需数据代码文档可以直接到文章最后关注获取。 1.项目背景 在金融市场日益复杂和波动加剧的背景下，风险管理成为金融机构和个人投资者关注的核心议题之一。VaR&…...
Linux nano命令的基本使用
参考资料 GNU nanoを使いこなすnano基础 目录 一. 简介二. 文件打开2.1 普通方式打开文件2.2 只读方式打开文件 三. 文件查看3.1 打开文件时，显示行号3.2 翻页查看 四. 文件编辑4.1 Ctrl K 复制 和 Ctrl U 粘贴4.2 Alt/Esc U 撤回 五. 文件保存与退出5.1 Ctrl …...
宇树科技，改名了！
提到国内具身智能和机器人领域的代表企业，那宇树科技（Unitree）必须名列其榜。 最近，宇树科技的一项新变动消息在业界引发了不少关注和讨论，即： 宇树向其合作伙伴发布了一封公司名称变更函称，因…...
逻辑回归暴力训练预测金融欺诈
简述 「使用逻辑回归暴力预测金融欺诈，并不断增加特征维度持续测试」的做法，体现了一种逐步建模与迭代验证的实验思路，在金融欺诈检测中非常有价值，本文作为一篇回顾性记录了早年间公司给某行做反欺诈预测用到的技术和思路。百度…...