当前位置: 首页 > news >正文

微信小程序pinia的应用

情景:院校列表的关注状态的实时更新

新建一个ts文件存储关注状态,用于集中管理用户“已关注院校”的相关状态和操作

import {definStore} from 'pinia';
import type { College_records } from '@/types/university';export const useFocusCollegeStore = defineStore('focusCollege',{
//定义一个响应式状态state:() => ({
//保存用户当前已关注的所有院校信息focusCollegeList: [] as College_records[],}),actions: {
//替换整个关注列表为新数组setFocusCollegeList(list: College_records[]) {this.focusCollegeList = list;},
// 向关注列表添加一个新的院校addFocusCollege(college: College_records) {this.focusCollegeList.push(college);},
//从列表移除某个院校removeFocusCollege(code: string) {this.focusCollegeList = this.focusCollegeList.filter(item => item.code !== code);},},
});
  • 只展示已关注的院校列表
    import { useFocusCollegeStore } from '@/stores/modules/useFocusCollegeStore';const focusCollegeStore = useFocusCollegeStore();const handleClickFocus = async (item:items) => {//....其它代码focusCollegeStore.removeFocusCollege(item.code);
    }

  • 在展示所有院校的列表里同步关注状态
    import { useFocusCollegeStore } from '@/stores/modules/useFocusCollegeStore';const focusCollegeStore = useFocusCollegeStore();//获取已关注院校的列表
    const fetchFocusCollegeList = async() => {//....其他代码const response = await getFocusCollege();focusCollegeStore.focusCollegeList = response.items || [];console.log('已关注院校:', focusCollegeStore.focusCollegeList);
    }//根据已关注列表更新院校关注状态
    const updateStatus = () =>{//...其他代码
    focusList.value = focusList.value.map(item => {const isBookmarked = focusCollegeStore.focusCollegeList.some(focusItem => focusItem.code === item.code);return {...item,bookmark: isBookmarked};
    };//监听store变化并自动更新
    watch(() => focusCollegeStore.focusCollegeList,() => {updateBookmarkStatus();},{ deep: true }
    );

相关文章:

微信小程序pinia的应用

情景:院校列表的关注状态的实时更新 新建一个ts文件存储关注状态,用于集中管理用户“已关注院校”的相关状态和操作 import {definStore} from pinia; import type { College_records } from /types/university;export const useFocusCollegeStore de…...

LWIP的超时事件笔记

那个马蜂佬,刚发就给我两个赞 lwIP超时事件处理简介 为每个与外界网络连接的任务都设定了timeout属性,即等待超时时间,例如TCP建立连接超时、ARP缓存表项的时间管理等,都需要超时操作来处理 lwIP超时事件机制 一共有四种 2.1&a…...

如何避免项目结束后知识流失

避免项目结束后知识流失的方法包括:建立项目知识库、实施定期知识回顾与总结、强化团队内部知识共享机制、利用合适的知识管理工具。项目知识库的建设尤其关键,它可帮助团队保留核心经验和方法,确保知识沉淀在组织内部。通过知识库&#xff0…...

【MCP】客户端配置(ollama安装、qwen2.5:0.5b模型安装、cherry-studio安装配置)

【MCP】客户端配置(ollama安装、qwen2.5:0.5b模型安装、cherry-studio安装配置) 客户端配置(1)下载安装ollama(2)安装qwen2.5:0.5b模型(3)安装配置cherry-studio 客户端配置 &#…...

Media3 中 Window 的时间相关属性详解

AndroidX Media3 的 Timeline.Window 类中,与时间相关的属性描述了媒体播放窗口(window)在时间维度上的关键信息。这些属性帮助开发者理解媒体的播放范围、起始点、持续时间以及与设备时间或直播流的同步关系。 Timeline.Window 的时间相关属…...

C 语言编码规范

在 C 语言开发过程中,遵循编码规范不仅能提高代码的可读性、可维护性,还能减少潜在的错误,提升团队协作效率。以下从多个维度详细阐述 C 语言编码过程中需要注意的规范要点。 一、命名规范 变量命名 变量命名应做到见名知意,采用…...

嵌入式开发学习日志Day15

一、指针指向字符型数组 (1)【const】:在指针变量中使用时,无法通过该指针修改被指向的变量; (2)【const】:关键字,在C和C中,能加就加,加了一定…...

从人脸扫描到实时驱动,超写实数字分身技术解析

在元宇宙浪潮中,数字人、虚拟数字人等新兴概念逐渐走进大众视野,其中数字分身作为虚拟数字人的细分领域,正引发广泛关注。数字分身依托人工智能与虚拟现实技术,能基于真人信息进行1:1复刻,具备与真人高度相似的外貌、声…...

Vue3 自定义指令的原理,以及应用

文章目录 前言一、原理说明二、注册与使用1. 全局注册2. 局部注册3. 使用方式 三、典型应用场景四、案例:权限控制指令五、注意事项 v-draggable✅ 目标效果:🧩 1. 自定义指令定义🧱 2. 在项目中注册🧪 3. 使用示例&am…...

306.检查是否所有A都在B之前

2124. 检查是否所有 A 都在 B 之前 - 力扣(LeetCode) class Solution {public boolean checkString(String s) {return !s.contains("ba");} } class Solution(object):def checkString(self, s):return s.find("ba")-1...

适合java程序员的Kafka消息中间件实战

创作的初心: 我们在学习kafka时,都是基于大数据的开发而进行的讲解,这篇文章为java程序员为核心,助力大家掌握kafka实现。 什么是kafka: 历史: 诞生与开源(2010 - 2011 年) 2010 年&#xf…...

当体育数据API遇上WebSocket:一场技术互补的「攻防战」

在世界杯决赛的最后一分钟,你正通过手机观看直播。突然,解说员大喊“球进了!”,但你的屏幕却卡在对方半场的回放画面——这种「延迟乌龙」的尴尬,正是实时体育应用面临的终极挑战。 在体育数字化浪潮下,用…...

1:点云处理—三种显示方法(自建点云)

1.彩色显示 *读取三维点云 dev_get_window(WindowHandle)dev_open_window(0, 0, 512, 512, black, WindowHandle1) read_object_model_3d(./19-12-26/t.ply, m, [], [], ObjectModel3D, Status)Instructions[0] : Rotate: Left button Instructions[1] : Zoom: Shift left…...

SCADA|KingSCADA运行报错:加载实时库服务失败

哈喽,你好啊,我是雷工! 最近在绵阳出差,在现场调试时遇到报错问题,翻了下以往记录没有该错误的相关笔记。 于是将问题过程及处理办法记录下来。 01 问题描述 昨天还好好的,可以正常运行的程序今天再次运行时报错: “加载 实时库服务 失败” 查看日志中错误信息如下: …...

k8s | Kubernetes 服务暴露:NodePort、Ingress 与 YAML 配置详解

CodingTechWork 引言 在 Kubernetes 集群中,服务暴露是将集群内部的服务对外部网络提供访问的关键环节。NodePort 和 Ingress 是两种常用的服务暴露方式,它们各有特点和适用场景。本文将详细介绍这两种方式的原理、配置方法以及如何通过 YAML 文件实现服…...

upload-labs靶场通关详解:第一关

一、一句话木马准备 新建一个文本文档,写入php代码,修改文件后缀名为php,保存。 phpinfo() 是 PHP 里的一个内置函数,其功能是输出关于当前 PHP 环境的详细信息。这些信息涵盖 PHP 版本、服务器配置、编译选项、PHP 扩展、环境变…...

SSA-CNN+NSGAII+熵权TOPSIS,附相关气泡图!

目录 效果一览基本介绍程序设计参考资料 效果一览 基本介绍 经典麻雀搜索算法深度学习多目标优化多属性决策!SSA-CNNNSGAII熵权TOPSIS,附相关气泡图!本文旨在通过优化卷积神经网络(CNN)以及采用NSGAII多目标优化与熵权…...

数据结构之栈与队列

一,栈和队列的区别 1、核心定义与特性 特性栈(Stack)队列(Queue)定义仅允许在栈顶(表尾)进行插入和删除的线性表,遵循 后进先出(LIFO)。允许在队尾插入、队…...

SSHv2 密钥交换(Key Exchange)详解

1. 算法协商 在密钥交换开始前,客户端和服务端会协商确定本次会话使用的算法组合。具体过程如下: 交换算法列表 客户端和服务端各自发送支持的算法列表,包括: 密钥交换算法(如 diffie-hellman-group14-sha256&#xf…...

从零开始学习three.js(15):一文详解three.js中的纹理映射UV

1. UV 映射基础概念 1.1 什么是 UV 坐标? 在三维计算机图形学中,UV 坐标是将二维纹理映射到三维模型表面的坐标系统。UV 中的 U 和 V 分别代表2D纹理空间的水平(X)和垂直(Y)坐标轴,与三维空间…...

解锁 Postgres 扩展日!与瀚高共探 C/Java 跨语言扩展技术的边界与未来

2025 年 5 月 13 日至 16 日(蒙特利尔时间),一年一度的 PostgreSQL 开发者大会 PGConf.dev(原 PGCON 会议)将在加拿大蒙特利尔盛大举行。同去年一样,在本次大会开幕的前一天同样会举办另外一个专场活动——…...

【Hive入门】Hive增量数据导入:基于Sqoop的关系型数据库同步方案深度解析

目录 引言 1 增量数据导入概述 1.1 增量同步与全量同步对比 1.2 增量同步技术选型矩阵 2 Sqoop增量导入原理剖析 2.1 Sqoop架构设计 2.2 增量同步核心机制 3 Sqoop增量模式详解 3.1 append模式(基于自增ID) 3.2 lastmodified模式(基…...

✍️【TS类型体操进阶】挑战类型极限,成为类型魔法师!♂️✨

哈喽类型战士们!今天我们要玩转TS类型体操,让你的类型系统像体操运动员一样灵活优雅~ 学会这些绝招,保准你的代码类型稳如老狗!(文末附类型体操段位表)🚀 一、什么是类型体操? &…...

部署Prometheus+Grafana简介、监控及设置告警(一)

部署PrometheusGrafana简介、监控及设置告警 一. 环境准备 服务器类型IP地址组件 Prometheus服务器、agent服务器、Grafana服务器192.168.213.7Prometheus 、node_expprter,Grafanaagent服务器192.168.213.8node_exporter 如果有防火请记得开启9090&am…...

k8s部署OpenELB

k8s部署OpenELB k8s部署OpenELB配置示例: layer2模式 k8s部署OpenELB 部署OpenELB至K8s集群 # k8s部署OpenELB kubectl apply -f https://raw.githubusercontent.com/openelb/openelb/refs/heads/master/deploy/openelb.yaml# 查看openelb的pod状态 kubectl get pods -n open…...

python打卡day18

聚类后的分析:推断簇的类型 知识点回顾: 推断簇含义的2个思路:先选特征和后选特征通过可视化图形借助ai定义簇的含义科研逻辑闭环:通过精度判断特征工程价值 作业:参考示例代码对心脏病数据集采取类似操作,并且评估特征…...

新品发布 | 96MHz主频 M0+内核低功耗单片机CW32L011产品介绍

CW32L011是基于 eflash 的单芯片低功耗微控制器,集成了主频高达 96MHz的 ARMCortex-M0内核、高速嵌入式存储器(多至 64K字节 FLASH 和多至 6K 字节 SRAM)以及一系列全面的增强型外设和 I/O 口。 所有型号都提供全套的通信接口(3路 UART、1路 SPI和1路12C)、12位高速…...

【面试 · 二】JS个别重点整理

目录 数组方法 字符串方法 遍历 es6 构造函数及原型 原型链 this指向 修改 vue事件循环Event Loop FormData 数组方法 改变原数组:push、pop、shift、unshift、sort、splice、reverse不改变原属组:concat、join、map、forEach、filter、slice …...

【详细教程】ROC曲线的计算方式与绘制方法详细介绍

《------往期经典推荐------》 一、AI应用软件开发实战专栏【链接】 项目名称项目名称1.【人脸识别与管理系统开发】2.【车牌识别与自动收费管理系统开发】3.【手势识别系统开发】4.【人脸面部活体检测系统开发】5.【图片风格快速迁移软件开发】6.【人脸表表情识别系统】7.【…...

【神经网络与深度学习】VAE 在解码前进行重参数化

在 VAE 中,解码之前进行重参数化主要有以下几个重要原因: 可微分性 在深度学习里,模型是通过反向传播算法来学习的,而这需要计算梯度。若直接从潜在变量的分布 (q_{\theta}(z|x))(由编码器输出的均值 (\mu) 和方差 (…...

ai agent(智能体)开发 python3基础11: java 调用python waitfor卡死,导致深入理解操作系统进程模型和IPC机制

java 调用python waitfor 卡死 导致浏览器无法自动关闭,java ,python双发无限等待 根源在于还是没有理解 进程之间标准输入输出到底是什么含义 系统进程与跨语言调用的核心机制 在跨语言调用(如Java调用Python)时,理…...

大模型赋能:2D 写实数字人开启实时交互新时代

在数字化浪潮席卷全球的当下,人工智能技术不断突破创新,其中大模型驱动的 2D 写实数字人正成为实时交互领域的一颗新星,引领着行业变革,为人们带来前所未有的交互体验。 一、2D 写实数字人概述 2D 写实数字人是通过计算机图形学…...

CATIA高效工作指南——零件建模篇(二)

一、PowerCopy特征复用技术 1.1 智能特征封装 通过​​几何图形集(Geometrical Set)​​构建参数化特征组,将关联的草图、曲面、实体等元素进行逻辑封装。操作流程如下: 创建新几何图形集并完成特征建模激活PowerCopy命令,选择目标几何集定…...

QT人工智能篇-opencv

第一章 认识opencv 1. 简单概述 OpenCV是一个跨平台的开源的计算机视觉库,主要用于实时图像处理和计算机视觉应用‌。它提供了丰富的函数和算法,用于图像和视频的采集、处理、分析和显示。OpenCV支持多种编程语言,包括C、Python、Java等&…...

java实现一个操作日志模块功能,怎么设计

为了设计一个高效、可靠且可扩展的操作日志模块,可以结合 ​AOP(面向切面编程)​、异步处理​(多线程或MQ)以及合理的存储策略,具体方案如下: ​1. 技术选型与架构设计​ ​​(1) AOP 实现非侵…...

音频相关基础知识

主要参考: 音频基本概念_音频和音调的关系-CSDN博客 音频相关基础知识(采样率、位深度、通道数、PCM、AAC)_音频2通道和8ch的区别-CSDN博客 概述 声音的本质 声音的本质是波在介质中的传播现象,声波的本质是一种波,是一…...

【Agent】使用 Python 结合 OpenAI 的 API 实现一个支持 Function Call 的程序,修改本机的 txt 文件

使用 Python 结合 OpenAI 的 API 来实现一个支持 Function Call 的程序,修改本机的 txt 文件。需要注意,在运行代码前,要确保已经安装了 openai 库,并且拥有有效的 OpenAI API Key。 import openai import os# 设置你的 OpenAI A…...

mint系统详解详细解释

Linux Mint是一款基于Ubuntu的开源桌面操作系统,以用户友好、稳定性强、功能全面著称,尤其适合从Windows迁移的新手和追求高效办公的用户。以下从技术架构、版本演进、生态体系、核心功能、应用场景等维度进行深度解析: 一、技术架构&#x…...

WordPress个人博客搭建(三):WordPress网站优化

前言 在之前的WordPress个人博客搭建(一)与WordPress个人博客搭建(二)文章中,我们已经在自己的非凡云云服务器上成功搭建了WordPress个人博客。现在让我们继续这场数字世界的耕耘,通过插件与主题的巧妙搭配…...

力扣1812题解

记录 2025.5.7 题目: 思路: 从左下角开始,棋盘的行数和列数(均从 1 开始计数)之和如果为奇数,则为白色格子,如果和为偶数,则为黑色格子。 代码: class Solution {pu…...

深入理解XGBoost(何龙 著)学习笔记(三)

原创 化心为海 微阅读札记https://mp.weixin.qq.com/s/vBE3fu9AZDjRFd5niJU0lg 2025年05月06日 18:17 北京 第三章 机器学习算法基础 摘要:本章首先介绍了基础的机器学习算法的实现原理和应用;然后对决策树模型做了详细介绍;最后&#xff0…...

一篇文章解析 H.264/AVC 视频编解码标准框架

古人有云: “不积跬步, 无以至千里; 不积小流, 无以成江海。” 本文给小伙伴们删繁就简介绍 H.264/AVC 视频编解码标准框架。 H.264/AVC框架 H.264/AVC 作为视频编码领域的里程碑标准,仍然沿用混合编码框架,但其通过模块化技术创新显著提升了压缩效率和网络适应性。H.264/AV…...

Sat2Density论文详解——卫星-地面图像生成

“Sat2Density: Faithful Density Learning from Satellite-Ground Image Pairs”,即从卫星-地面图像对中学习忠实的密度表示。论文的主要目标是开发一种能够准确表示卫星图像三维几何结构的方法,特别关注从卫星图像中合成具有3D意识的地面视图图像的挑战…...

【计算机架构】RISC(精简指令集计算机)架构

一、引言 在计算机科学技术飞速发展的长河中,计算机架构犹如一艘艘领航的巨轮,不断引领着计算技术朝着更高性能、更低功耗、更智能化的方向前行。RISC(精简指令集计算机)架构便是其中一艘极为独特且极具影响力的“巨轮”。从早期计…...

智算中心基础设施0-1建设全流程及投产后的运维

0 - 1 建设全流程 规划与设计 需求分析:与相关部门和用户沟通,了解智算中心的业务需求,包括计算能力、存储容量、网络带宽、应用场景等,为后续的设计提供依据。选址规划:考虑电力供应、网络接入、环境条件、安全因素等…...

用3D slicer 去掉影像中的干扰体素而还原干净影像(脱敏切脸处理同)

今天遇到一个特殊的影像,扫描被试的头颅被很多干扰阴影快给遮盖住了,3D 建模出来的头颅有很多干扰,非常影响处理和视觉体验,正好解锁一个3D slicer 的功能吧。 背景:有一个被试数据头顶有很多干扰,直接覆盖…...

滚动条样式

title: 滚动条样式 date: 2025-05-07 19:59:31 tags:css 滚动条样式完整定义 HTML 示例 以下是一个包含所有主流浏览器滚动条样式属性的完整HTML文件&#xff0c;涵盖了WebKit内核浏览器和Firefox的滚动条定制&#xff1a; <!DOCTYPE html> <html lang"zh-CN&…...

Prompt(提示词)工程师,“跟AI聊天”

提示词工程师这活儿早就不只是“跟AI聊天”那么简单了&#xff0c;特别是现在MetaGPT、LangChain这些框架出来后&#xff0c;整个赛道都升级成“AI指挥官”的较量了。 第一层&#xff1a;基础能力得打牢 AI语言学家的功底 别笑&#xff0c;真得像学外语一样研究大模型。比如GP…...

Java版ERP管理系统源码(springboot+VUE+Uniapp)

ERP系统是企业资源计划&#xff08;Enterprise Resource Planning&#xff09;系统的缩写&#xff0c;它是一种集成的软件解决方案&#xff0c;用于协调和管理企业内各种关键业务流程和功能&#xff0c;如财务、供应链、生产、人力资源等。它的目标是帮助企业实现资源的高效利用…...

金融小知识

&#x1f4c9; 一、“做空”是啥&#xff1f; 通俗说法&#xff1a;押“它会跌”&#xff0c;赚钱&#xff01; ✅ 举个例子&#xff1a; 有一天老王的包子涨价到 10 块一个&#xff0c;张三觉得这价格肯定撑不住&#xff0c;未来会跌到 5 块。于是他&#xff1a; 向朋友借了…...