04 2024 档案
摘要：微头条项目链接 作为JavaWeb的收官之作，这里记载了写项目时遇到的问题。 前提：使用maven进行依赖管理 1.JJWT导入依赖太少 最初只导入了 <dependency> <groupId>io.jsonwebtoken</groupId> <artifactId>jjwt-api</arti
阅读全文
摘要：到目前一共学习了两种传参方式。 1.组件传参 2.路由传参 这两种传参方式并不好用，所以出现了Pinia Pinia平替了Vuex，而且比它更优秀。 Pinia是Vue衍生的生态系统之一，所以，在使用它前需要导入依赖。 npm i pinia 简单地说，Pinia就是共享数据。各个.vue组件可以利
阅读全文
摘要：浏览器拥有最基本的安全机制，同源策略。 违背同源策略的交互，会被浏览器认为是不安全的交互，所以不解析。 什么是域？(源) 协议，域名，端口。 什么是跨域？ 访问不同的域。 即便协议，域名相同，端口号不一样也会违背同源策略。 前后端分离后，前端服务器负责视图，后端服务器负责数据。 不同的服务器，其域必
阅读全文
摘要：如果想在axios发送HTTP请求之前。或者是接收响应之前做一些额外的工作,可以通过拦截器完成。 Axios拦截器分为请求拦截器，响应拦截器。分别在请求或响应时生效。 一图了解Axios拦截器 提供了两种文本函数：名字太长，直接看语法 语法格式如下： //请求拦截器，f1对应请求发送 成功 函数，f
阅读全文
摘要：Vue 推荐使用 axios 来完成 ajax 请求。 axios中文文档 Axios Axios是一款基于Promise，用于发送HTTP请求和处理HTTP响应的工具库。 内部也是使用原生的ajax对象发送HTTP请求。 所以，在使用它前需要导入依赖。 npm install axios 提供了一
阅读全文
摘要：在学习axios之前，需要学习ES6提供的Promise对象。 普通函数和回调函数 学习Promise的预备知识，回调函数 普通函数 普通函数: 正常调用的函数,普通函数执行完毕后才会继续执行下一行代码。 按照编码顺序执行。 function f1() { console.log("普通函数f1执行
阅读全文
摘要：需求 未登录无法访问除login页面 练习 1.使用vite创建项目，导入依赖 npm create vite 选择vue+js npm i 导入基本依赖 npm vue-router 导入路由依赖 2. 创建组件，login.vue、home.vue、list.vue 仅展示home.vue组件，
阅读全文
摘要：路由守卫就是在切换页面的期间，执行的函数。 类似于Vue的钩子函数 类似于Setvlet的Filter(过滤器) 路由守卫 路由守卫，就是在路由切换期间执的函数。 由vue-router提供的两个常见守卫(函数)： 全局前置守卫beforeEach和全局后置守卫afterEach 语法格式如下： /
阅读全文
摘要：在上一章节，<router-link to="/left">左</router-link> 这种这种路由,to中的内容目前是固定的。被称之为声明式路由（或普通路由） 编程式路由 编程式路由，可以按需决定某组件的路由地址。 vue-router提供了一个函数：useRouter 语法格式如下： //该
阅读全文
摘要：什么是路由？ 类似于Servlet的映射路径。 路由可以让，不同的URL展示不同的页面。 Router Router是Vue衍生的生态系统之一，所以需要单独安装。 路由案例需求 1 安装依赖 还记得npm安装依赖指令吗？看这。 npm i vue-route 1-1 编写组件 略 2 编写路由配置
阅读全文
摘要：生命周期 之前在Servlet等也学习过生命周期，相同的，VUE组件也有生命周期。 VUE组件完全解析到浏览器，会经过如下过程。（简单理解） vue组件被实例化的过程，称为，组件实例化。 组件实例解析到浏览器中，称为，挂载。 组件实例从浏览器中删除，称为，卸载。 钩子函数 vue组件解析到浏览器的这
阅读全文
摘要：单向绑定 之前学习的栗子，都是单向绑定。 单向绑定: 响应式数据对象的变化会更新dom树，用户的某些操作造成的数据更新，不会同步更新到响应式数据对象。 栗子 App.vue <script setup> import {ref, reactive} from 'vue'; let msg = ref
阅读全文
摘要：响应式数据 什么是响应式数据？ 当数据发生改变时，DOM树的内容，会和数据同步更新。 vue3不是自动响应式数据，需要经过函数处理得到响应式数据对象。 ref和reactive 这两个函数都会返回响应式数据对象，但也有不同。 ref ref通常用于将一个基本类型转为响应式数据对象。 基本类型包括：数
阅读全文
摘要：插值表达式 VUE中最基本的数据绑定形式。 语法格式如下： {{ 数据来源 }} 插值表达式的特点： 不依靠标签。 可以调用函数。 支持运算符。 栗子 App.vue <script setup> let msg = "字符串"; let num = 10; function f1() { retu
阅读全文
摘要：当浏览器接收到服务端返回的页面后，浏览器会把页面解析成DOM树，DOM树中各个元素会相应的显示在浏览器上。 VUE提供的响应式数据可以在页面不刷新的情况下更新数据。 响应式数据 App.vue <script> //等价于setup语法糖。固定的写法，不会改。 export default { se
阅读全文
摘要：在一个.Vue文件中，通常包括以下三部分。 <template> <style> <script> .vue中部分 传统部分 描述 <template> HTML 代替传统的.html文件 <style> CSS 代替传统的.js文件 <script> JS 代替传统的.css文件 声明内部的CSS
阅读全文
