学海无涯，回头是岸

本文介绍了一个基于AbortController的Vue Hook实现，用于处理长时间请求时的用户取消功能。该Hook主要解决以下问题：1)请求时显示加载动画；2)2秒未返回结果时弹出可取消提示；3)提供请求中止机制。实现步骤包括：创建AbortSignal信号、延迟弹窗逻辑、清理机制设计。使用时只需将signal传递给支持中止的请求接口，并调用Hook提供的方法。最终效果是当请求超时，用户可选择取消，避免界面卡死。文中还提供了完整的Hook代码实现和调用示例。

在vue3.3x 版本中 官方 [RFC](https://github.com/vuejs/rfcs/discussions/503) 放出了 一个新特性 defineModel，它将让我们在自定义组件上双向绑定数据更加快捷；

其本质是一种限制 高频执行代码 的手段；页面中常见的表单提交、短信验证码、搜索框、浏览器 resize、 scroll、 mousemove等事件触发时，会不断的调用绑定在事件上的回调函数，影响前端性能，导致出现响应延迟、假死、卡顿等现象

token 验证登录是目前比较主流的前端登录校验方案，采用 token + localStorage + vuex 做令牌存储验证，包含 axios 二次封装、路由守卫、api 模块化等操作

页面刷新时，将重新初始化vuex的数据，导致无法获取数据，使得页面数据丢失。解决办法修改store文件下Index中state的定义const store = new Vuex.Store({ state:sessionStorage.getItem('state') ? JSON.parse(sessionStorage.getItem('state')): ........

当在含分页的table中，需分页切换后对列表项的勾选状态做回显操作。根据element文档使用this.$refs.mytable.toggleRowSelection（row, selected）方法回显，实际应用时会出现回显失效的情况。