news 2026/2/19 10:42:29

JavaWeb从入门到进阶(vue与Ajax Axios)

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
JavaWeb从入门到进阶(vue与Ajax Axios)

什么是Vue:
Vue是一套前端框架,免除原生javaScript中的DOM操作,简化书写。
基于MVVM(Model-View-ViewModel)思想,实现数据的双向绑定,将编程的关注点放在数据上

本质区别:

  • 原生JS:你要告诉浏览器每一步怎么做

  • Vue:你告诉Vue你想要什么效果,Vue帮你处理DOM操作

  • Vue指令就像是预置的、智能的JS函数,让你用更少的代码完成更复杂的交互,把从"数据变化"到"视图更新"的过程自动化了。

官网: https://v2.cn.vuejs.org/

框架:是一个半成品软件;是一套可重用的,通用的,软件基础代码模型。基于框架进行开发,更加快捷,更加高效

插值表达式
形式:{{表达式))。
内容可以是:
变量
三元运算符
函数调用
算术运算

Vue的常用指令

指令:HTML标签上带有v-前缀的特殊属性,不同指令具有不同含义。例如:v-if,v-for...
常用指令
v-bind 为HTML标签绑定属性值,如设置href,css样式等
v-model在表单元素上创建双向数据绑定

通过v-bind v-modle 绑定的变量,必须在数据模型中声明


v-On为HTML标签绑定事件





v-if
v-else-if条件性的渲染某元素,判定为true时渲染,否则不渲染
v-else


v-show根据条件展示某元素,区别在于切换的是display属性的值


v-for列表渲染,遍历容器的元素或者对象的属性

生命周期

生命周期:指一个对象从创建到销毁的整个过程。
生命周期的八个阶段:每触发一个生命周期事件,会自动执行一个生命周期方法(钩子)。

Ajax


概念:Asynchronous JavaScript And XML,异步的JavaScript和XML。
作用:
数据交换:通过Ajax可以给服务器发送请求,并获取服务器响应的数据。
异步交互:可以在不重新加载整个页面的情况下,与服务器交换数据并更新部分网页的技术,如:搜索联想、用户名是否可用的校验等等。

原生Ajax
1.准备数据地址:htp://yapi.smart-xwork.cn/mock/169327/emp/list
2.创建XMLHttpRequest对象:用于和服务器交换数据
3.向服务器发送请求
4.获取服务器响应数据

Axios对原生的Ajax进行了封装,简化书写,快速开发

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/2/16 16:23:45

Linux初探:从零开始的命令行冒险

🔥 码途CQ: 个人主页 ✨ 个人专栏: 《Linux》 | 《经典算法题集》 《C》 《QT》 ✨ 追风赶月莫停留,无芜尽处是春山! 💖 欢迎关注,一起交流学习 💖 📌 关注后可第一时间获取C/Qt/算…

作者头像 李华
网站建设 2026/2/7 20:05:19

机器学习在大数据质量检测中的应用案例

机器学习在大数据质量检测中的应用案例 关键词:机器学习、大数据质量检测、数据清洗、异常检测、特征工程、模型评估、数据治理 摘要:本文深入探讨了机器学习技术在大数据质量检测领域的应用实践。我们将从大数据质量的核心问题出发,系统介绍机器学习在数据质量检测中的技术…

作者头像 李华
网站建设 2026/2/17 13:10:43

全网最全9个AI论文工具,助本科生轻松搞定毕业论文!

全网最全9个AI论文工具,助本科生轻松搞定毕业论文! AI 工具让论文写作不再难 随着人工智能技术的飞速发展,越来越多的本科生开始借助 AI 工具来辅助完成毕业论文。这些工具不仅能够有效降低 AIGC(人工智能生成内容)率&…

作者头像 李华
网站建设 2026/2/10 9:36:51

如何在一个可执行程序中执行脚本语言

在可执行程序中执行脚本语言通常称为“脚本引擎集成”。常见方式有&#xff1a; 1. 使用嵌入式脚本语言库 Lua&#xff08;最流行的选择&#xff09; // C/C 中集成 Lua #include <lua.h> #include <lualib.h> #include <lauxlib.h>int main() {lua_State *L…

作者头像 李华