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部署

相关推荐
源码云商4 分钟前
基于Spring Boot + Vue的教师工作量管理系统设计与实现
vue.js·spring boot·后端
*TQK*5 分钟前
高等数学笔记——向量代数与空间解析几何1
笔记·学习·高等数学
BillKu27 分钟前
el-radio-group 与 el-dropdown 组合使用的注意事项
前端·javascript·vue.js
黑匣子~42 分钟前
Electron 后台常驻服务实现(托盘 + 开机自启)
前端·javascript·electron
love530love1 小时前
【笔记】PyCharm 中创建Poetry解释器
运维·人工智能·windows·笔记·python·pycharm·conda
charlee441 小时前
实现一个前端动态模块组件(Vite+原生JS)
前端·javascript·html·vite
我是坑货1 小时前
Spring学习笔记 IoC容器和XML的IoC装配
笔记·学习·spring
我最厉害。,。2 小时前
JS 应用&安全案例&泄漏云配置&接口调试&代码逻辑&框架漏洞自检
开发语言·javascript·安全
人类恶.2 小时前
C 语言学习笔记(指针1)
c语言·笔记·学习
liang_20262 小时前
【ULR #1】打击复读 (SAM, DAG链剖分)
笔记·学习·算法·图论