javaweb自用笔记:Vue

Vue

什么是vue

vue案例

1、引入vue.js文件

2、定义vue对象

3、定义vue接管的区域el

4、定义数据模型data

5、定义视图div

6、通过标签v-model来绑定数据模型

7、{{message}}直接将数据模型message展示出来

8、由于vue的双向数据绑定,当视图层标签input里的message发生变化,那么数据模型message也会发生变化

vue的常用指令

v-bind和v-model

v-on

v-if、v-show(条件不成立也会渲染,只是隐藏了)

v-for

生命周期

当完成某个阶段,自动执行

异步交互Ajax

Ajax的作用

同步与异步

同步:客户端需要等服务器响应后才能操作

异步:客户端在等服务器响应的同时还可以进行其他操作

原生Ajax

Ajax-Axios2

基于原生的Ajax封装起来的技术

案例

加载html页面时自动触发钩子函数mounted,在函数发送异步请求获取数据

前端工程化

前后端分离开发

YApi

vuej脚手架环境准备

安装nodejs和vue脚手架:Day03-04. 前端工程化-环境准备_哔哩哔哩_bilibili

vue项目目录结构

创建vue项目:Day03-05. 前端工程化-Vue项目_哔哩哔哩_bilibili

vue组件库element

快速入门

vue路由

打包

nginx部署

相关推荐
计算机毕设VX:Fegn08951 天前
计算机毕业设计|基于springboot + vue图书商城系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·后端·课程设计
Galloping-Vijay1 天前
Claude Code 使用笔记
笔记
哆啦A梦15881 天前
商城后台管理系统 03 登录布局
javascript·vue.js·elementui
曼巴UE51 天前
UE FString, FName ,FText 三者转换,再次学习,官方文档理解
服务器·前端·javascript
selt7911 天前
Redisson之RedissonLock源码完全解析
android·java·javascript
行走的陀螺仪1 天前
高级前端 Input 公共组件设计方案(Vue3 + TypeScript)
前端·javascript·typescript·vue·组件设计方案
极市平台1 天前
骁龙大赛-技术分享第5期(上)
人工智能·经验分享·笔记·后端·个人开发
一颗不甘坠落的流星1 天前
【Antd】基于 Upload 组件,导入Json文件并转换为Json数据
前端·javascript·json
啄缘之间1 天前
11. UVM Test [uvm_test]
经验分享·笔记·学习·uvm·总结
LYFlied1 天前
Vue2 与 Vue3 虚拟DOM更新原理深度解析
前端·javascript·vue.js·虚拟dom