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

相关推荐
@HNUSTer4 小时前
基于 HTML、CSS 和 JavaScript 的五子棋游戏
前端·javascript·css·游戏·html
百锦再4 小时前
Vue核心知识:动态路由实现完整方案
前端·javascript·vue.js·前端框架·vue·路由·动态
拉不动的猪5 小时前
刷刷题24
前端·javascript·面试
GISer_Jing5 小时前
【数据结构】二叉树总结篇
javascript·数据结构
贝塔实验室5 小时前
FPGA 配置原理
经验分享·笔记·其他·fpga开发·硬件架构·硬件工程·fpga
Smile_Gently5 小时前
v-code-diff 配置
前端·javascript·vue.js
敲代码中6 小时前
CSS_复合选择器
前端·javascript·html
jingjingjing11116 小时前
笔记:代码随想录算法训练营第35天: 01背包问题 二维、 01背包问题 一维 、LeetCode416. 分割等和子集
数据结构·笔记·算法·leetcode·动态规划
肆——6 小时前
深度学习代码解读——自用
人工智能·笔记·python·深度学习
饕餮争锋6 小时前
大模型笔记_大模型是如何理解输入信息的
笔记