vue数据持久化仓库
本文章是一篇记录实用性vue数据持久化仓的使用!
首先在src中创建store文件夹,并创建一个根据本页面相关的名称,
在终端导入:npm i pinia 和 npm i pinia-plugin-persistedstate
接下来引入代码:
import { defineStore } from "pinia";
import { order } from "../api/OrderForGoods";
const useOrder = defineStore('order',{state:()=>({data:[]}),actions:{async getOrder(){if(this.data.length ){return{data:this.data}}else{let url = await order()console.log(url);this.data = url.datareturn{data:url.data}}}},persist:{enable:true,storage:localStorage}
})
export default useOrder;
其中import { order } from "../api/OrderForGoods";引入本页面所要存储数据的接口,
import { order } from "../api/OrderForGoods";
这是先给一个初始值。为空,然后判断他啊的长度,data:this.data。这个最后点data,是接口中,返回数据的名称,有可能为res,有可能为list等等。。。
当第一次进入页面的时候会比较慢行。它是读取这个数组,然后将他储存到本地存储上面。等下次再进这个页面的时候,就不会在重新请求数据而产生白屏。

相关文章:
vue数据持久化仓库
本文章是一篇记录实用性vue数据持久化仓的使用! 首先在src中创建store文件夹,并创建一个根据本页面相关的名称, 在终端导入:npm i pinia 和 npm i pinia-plugin-persistedstate 接下来引入代码: import { defineSt…...
OrangePi AIpro评测 - 基础操作篇
0. 环境 ●OrangePi AIpro ●win10笔记本 ●路由器 准备下win10电脑、路由器,这些板卡通常是在网络正常的环境下才方便测试。 还要准备OrangePi AIpro的官方资料: http://www.orangepi.cn/html/hardWare/computerAndMicrocontrollers/service-and-suppo…...
不含一阶导数项的线性二阶微分方程的通解
假设这里有一个线性二阶微分等式,形式如下: (1) 其中是连续的,是在实闭区间是连续的,如果有人倾向于推广,在相对假弱的假设下,这个结果能够被发现。如果是下列其次线性方程的任意两个线性无关的…...
Redis篇 String
String概念和set,get扩充 一. String类型的基本介绍二. String中set,get方法扩充 一. String类型的基本介绍 redis中所有的key都是字符串类型的,但是value的类型差异很大. redis中的字符串,直接就是二进制方式存储的,可以存储整数,二进制数据 文本数据,Json,xml还有音频等. 二.…...
【vue-2】v-on、v-show、v-if及按键修饰符
目录 1、v-on事件 2、按键修饰符 3、显示和隐藏v-show 4、条件渲染v-if 1、v-on事件 创建button按钮有以下两种方式: <button v-on:click"edit">修改</button> <button click"edit">修改</button> 完整示例代码…...
华为交换机基础实验----VLAN基础
交换机篇实验: 给交换机创建VLAN 1.单个VLAN的创建 [S]vlan 10 查看的方法:dis vlan 2.批量创建vlan的方法 Vlan b 20 30 40 连续创建三个vlan,分别为vlan20 vlan30和vlan40 [SONY-S1-vlan10]vlan b 20 30 40 3.批量创建连续的vlan…...
Vue3学习使用axios和qs进行POST请求和响应处理
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 一、前言1.准备工作2.发送POST请求3.处理响应数据4.总结 一、前言 在前端开发中,经常需要与后端进行数据交互,其中包括发送POST请求并处理响…...
张大哥笔记:赚钱高手养成计划---如何将一份时间产生N份收入?
我们常说的赚钱的四种境界有哪些? 1.靠体力挣钱 2.靠技能挣钱 3.靠知识挣钱 4.靠平台钱生钱 所以对应的收入的模式就会是下面4种模式: 1.一份时间卖1次 2.一份时间卖N次 3.一份时间溢价卖N次 4.购买他人时间为自己所用 时间对于每个人都是相同的…...
excel里如何将数据分组转置?
这个表格怎样转换为下表?按照国家来分组,把不同年份对应的不同序列值进行转置?? 这演示用数据透视表就完成这个数据转换。 1.创建数据透视表 选中数据中任意单元格,点击插入选项卡,数据透视表,…...
WHAT - 前端安全性测试和常见攻击手段
目录 一、安全性测试二、前端安全性测试三、跨站脚本(XSS)攻击1. 介绍2. 三大类型反射型 XSS(Reflected XSS)存储型 XSS(Stored XSS)DOM 型 XSS(DOM-based XSS) 3. xss 盲打4. xss 水…...
重量and体积,不要在傻傻的花冤枉钱寄快递了!
寄快递时有没有遇到过明明不重却被按体积收费的情况?别急,今天就来给大家揭秘快递收费的奥秘! 实际重量和体积重量! 首先,我们要明白两个概念:实际重量和体积重量。实际重量就是你看到的物品重量…...
docker ps显示的参数具体是什么意思
1,运行一个容器 docker run -d ubuntu:15.10 /bin/sh -c "while true; do echo hello world; sleep 1; done"这段命令的作用是使用 docker run 命令运行一个基于 ubuntu:15.10 镜像的 Docker 容器,并在容器中执行一个无限循环的命令。 具体解…...
【C++】多态:编程中的“一人千面”艺术
目录 一、多态的概念二、多态的定义及实现1.多态的构成条件2.虚函数的重写2.1 什么是虚函数?2.2 虚函数的重写是什么?2.3 虚函数重写的两个例外2.4 C11 override 和 final2.5 重载、覆盖(重写)、隐藏(重定义)的对比 三、抽象类3.1 概念3.2 接口继承和实现…...
【必备工具】gitee上传-保姆级教程
目录 1.gitee是什么 2.gitee怎么注册 编辑 3.gitee怎么提交代码 4.gitee的三板斧 Clone仓库 Q&A 1. Gitee 只有三板斧吗? 2. Git 教了,Gitee 上没有绿点怎么办? 3. 用户名和密码输入错误怎么办? 4. 操作时不小心…...
P1115 最长子段和
题目描述 给出一个长度为 𝑛n 的序列 𝑎a,选出其中连续且非空的一段使得这段和最大。 输入格式 第一行是一个整数,表示序列的长度 𝑛。 第二行有 𝑛n 个整数,第 𝑖 个整数表示序列的…...
02 FreeRTOS 任务
1、创建任务函数 1.1 动态内存的使用 在之前我们如果要创建一个与学生有关的任务,我们会定义: //打印50个学生的信息 char name[50][100]; int age[50]; int sex[50]; //1表示男,0表示女 int score[50]; 如果之后要对其进行修改会非常麻烦&…...
NSS题目练习4
[LitCTF 2023]1zjs 打开后是一个游戏,用dirsearch扫描,什么都没发现 查看源代码搜索flag,发现没有什么用 搜索php,访问 出现一堆符号,看样子像是jother编码 解码得到flag,要删掉[] [LitCTF 2023]Http pro …...
【算法】合并k个已排序的链表
✨题目链接: NC51 合并k个已排序的链表 ✨题目描述 合并 k 个升序的链表并将结果作为一个升序的链表返回其头节点。 数据范围:节点总数 0≤𝑛≤50000≤n≤5000,每个节点的val满足 ∣𝑣𝑎𝑙∣&…...
【Muduo】三大核心之EventLoop
Muduo网络库的EventLoop模块是网络编程框架中的核心组件,负责事件循环的驱动和管理。以下是对EventLoop模块的详细介绍: 作用与功能: EventLoop是网络服务器中负责循环的重要模块,它持续地监听、获取和处理各种事件,…...
ubuntu安装完桌面后如何启动
ubuntu安装完桌面后如何启动 在Ubuntu服务器上安装桌面环境后,您可以使用以下命令启动图形界面: sudo systemctl start gdm3如果您使用的是Ubuntu 20.04或更新版本,可能需要使用gdm3作为显示管理器。在早期的Ubuntu版本中,可能使…...
ES6从入门到精通:前言
ES6简介 ES6(ECMAScript 2015)是JavaScript语言的重大更新,引入了许多新特性,包括语法糖、新数据类型、模块化支持等,显著提升了开发效率和代码可维护性。 核心知识点概览 变量声明 let 和 const 取代 var…...
循环冗余码校验CRC码 算法步骤+详细实例计算
通信过程:(白话解释) 我们将原始待发送的消息称为 M M M,依据发送接收消息双方约定的生成多项式 G ( x ) G(x) G(x)(意思就是 G ( x ) G(x) G(x) 是已知的)࿰…...
基于uniapp+WebSocket实现聊天对话、消息监听、消息推送、聊天室等功能,多端兼容
基于 UniApp + WebSocket实现多端兼容的实时通讯系统,涵盖WebSocket连接建立、消息收发机制、多端兼容性配置、消息实时监听等功能,适配微信小程序、H5、Android、iOS等终端 目录 技术选型分析WebSocket协议优势UniApp跨平台特性WebSocket 基础实现连接管理消息收发连接…...
CMake 从 GitHub 下载第三方库并使用
有时我们希望直接使用 GitHub 上的开源库,而不想手动下载、编译和安装。 可以利用 CMake 提供的 FetchContent 模块来实现自动下载、构建和链接第三方库。 FetchContent 命令官方文档✅ 示例代码 我们将以 fmt 这个流行的格式化库为例,演示如何: 使用 FetchContent 从 GitH…...
JDK 17 新特性
#JDK 17 新特性 /**************** 文本块 *****************/ python/scala中早就支持,不稀奇 String json “”" { “name”: “Java”, “version”: 17 } “”"; /**************** Switch 语句 -> 表达式 *****************/ 挺好的ÿ…...
3-11单元格区域边界定位(End属性)学习笔记
返回一个Range 对象,只读。该对象代表包含源区域的区域上端下端左端右端的最后一个单元格。等同于按键 End 向上键(End(xlUp))、End向下键(End(xlDown))、End向左键(End(xlToLeft)End向右键(End(xlToRight)) 注意:它移动的位置必须是相连的有内容的单元格…...
今日学习:Spring线程池|并发修改异常|链路丢失|登录续期|VIP过期策略|数值类缓存
文章目录 优雅版线程池ThreadPoolTaskExecutor和ThreadPoolTaskExecutor的装饰器并发修改异常并发修改异常简介实现机制设计原因及意义 使用线程池造成的链路丢失问题线程池导致的链路丢失问题发生原因 常见解决方法更好的解决方法设计精妙之处 登录续期登录续期常见实现方式特…...
云原生玩法三问:构建自定义开发环境
云原生玩法三问:构建自定义开发环境 引言 临时运维一个古董项目,无文档,无环境,无交接人,俗称三无。 运行设备的环境老,本地环境版本高,ssh不过去。正好最近对 腾讯出品的云原生 cnb 感兴趣&…...
GitHub 趋势日报 (2025年06月06日)
📊 由 TrendForge 系统生成 | 🌐 https://trendforge.devlive.org/ 🌐 本日报中的项目描述已自动翻译为中文 📈 今日获星趋势图 今日获星趋势图 590 cognee 551 onlook 399 project-based-learning 348 build-your-own-x 320 ne…...
解析两阶段提交与三阶段提交的核心差异及MySQL实现方案
引言 在分布式系统的事务处理中,如何保障跨节点数据操作的一致性始终是核心挑战。经典的两阶段提交协议(2PC)通过准备阶段与提交阶段的协调机制,以同步决策模式确保事务原子性。其改进版本三阶段提交协议(3PC…...
