引入 pinia 来方便处理全局变量。

  npm install pinia

1、创建 pinia

2、main 中引入(我这里是直接写的 index,所以导出的是 stores)

3、定义变量

使用:

注:

开发门户项目过程中,遇到了多个路由使用复用同一个页面的情况,内容显示标题为跳转携带参数传递,但一刷新界面,参数丢失就导致界面内容为空,故调整为用 pinia 记录跳转参数以避免参数丢失。

另因为标题是传参显示,故切换界面语言时,并不能实时刷新,所以增加了监听使用:

vue3 门户网站搭建3-pinia的更多相关文章

  1. linux下网站搭建

    我们知道windows网站搭建一般是:IIS+Asp+Sqlserver,而 linux网站搭建是:Apache+php+Mysql.两者之间个有千秋,但是为什么我们许多的门户网站搭建都选择linux ...

  2. 爬虫抓取5大门户网站和电商数据day1:基础环境搭建

    最新想用爬虫实现抓取五大门户网站(搜狐.新浪.网易.腾讯.凤凰网)和电商数据(天猫,京东,聚美等), 今天第一天先搭建下环境和测试. 采用maven+xpath+ HttpClient+正则表达式. ...

  3. 外网主机访问虚拟机下的Web服务器_服务器应用_Linux公社-Linux系统门户网站

    body{ font-family: "Microsoft YaHei UI","Microsoft YaHei",SimSun,"Segoe UI& ...

  4. 电商门户网站商品品类多级联动SpringBoot+Thymeleaf实现

    在淘宝.京东等电商网站,其门户网站都有一个商品品类的多级联动,鼠标移动,就显示,因为前端不是我做的,所以不说明前端实现,只介绍后端实现. 搭建部署SpringBoot环境 配置文件配置: 开启了对Th ...

  5. PHPCMS V9轻松完成WAP手机网站搭建全教程

    ---恢复内容开始--- 应用PHPCMS V9轻松完成WAP手机网站搭建全教程 用PHPCMS最新发布的V9搭建了PHPCMS研究中心网站(http://www.17huiyi.net)完成后,有用 ...

  6. 基于Vue开发的门户网站展示和后台数据管理系统

    基于Vue的前端框架有很多,这几年随着前端技术的官方应用,总有是学不完的前端知识在等着我们,一个人的精力也是有限,不可能一一掌握,不过我们学习很大程度都会靠兴趣驱动,或者目标导向,最终是可以以点破面, ...

  7. node.js express安装及示例网站搭建

    1.首先肯定是要安装Node.JS windows cmd依次输入如下命令: cd C:\Program Files\nodejs\ npm install -g expressnpm install ...

  8. SharePoint Online 创建门户网站系列之定制栏目

    前 言 SharePoint Online自带的库就带有二级页面和详细页面,也就是Allitems页面和DispForm页面,但是实在不够美观,尤其对于门户网站这一企业门面来说,更是无法接受. 下面, ...

  9. SharePoint Online 创建门户网站系列之创建栏目

    前 言 SharePoint Online的栏目,简单描述即显示在首页上的各个模块信息,这里,我们主要介绍我们首页上的栏目,包括简介类型.新闻列表类型.图片类型: 下面,让我们开始在SharePoin ...

  10. SharePoint Online 创建门户网站系列之图片滚动

    前 言 创建SharePoint Online栏目我们之前已经介绍过了,具体就是内容编辑器方式.自带WebPart方式和JavaScript读取后台数据前台做展示的三种: 但是,对于复杂的展示来说,这 ...

随机推荐

  1. 搭个ChatGPT算法模型,离Java程序员有多远?

    作者:小傅哥 博客:https://bugstack.cn 沉淀.分享.成长,让自己和他人都能有所收获! 最近 ChatGPT 很火,火到了各行各业.记得去年更多的还是码农最新体验后拿它搜代码,现在各 ...

  2. setInterval()的使用

    setInterval() 作用  这个函数可以将一个函数每隔一段时间执行一次 参数  1.回调函数,该函数会每隔一段时间被调用一次  2.每次调用间隔的时间,单位是毫秒 返回值  返回一个Numbe ...

  3. 题解 [HAOI2007]分割矩阵

    % 你赛考到了,看到如此之小的数据范围,想到考前每次都被状压 dp 吊起来打的惨痛经历,第一反应就是状压. 然后发现横竖切这个不太好记录就摆了去看 T2,然后没想到这么简单. 令 \(f_{a, b, ...

  4. 11款Linux数据恢复工具!

    转载:<Linux就该这么学> - 必读的Linux系统与红帽RHCE认证免费自学书籍 (linuxprobe.com) 11款最棒的Linux数据恢复工具发布啦! | <Linux ...

  5. UnoCSS 简化 CSS 的书写

    CSS 样式太多,重复写 在学习 UnoCSS 之前,我提出几个问题: 你是否有过写完了 HTML 之后,跳转到 style 写 CSS 这样来回跳转的痛苦? 你是否有过不知道如何给节点取类名的痛苦( ...

  6. Solon2 与 Spring Boot 的区别

    1.与 Springboot 的常用注解比较 Solon 2.2.0 Springboot 2.7.8 说明 @Inject * @Autowired 注入Bean(by type) @Inject( ...

  7. 聊一下kafka的消费组

    介绍 消费组使kafka中很重的概念,只有弄清楚消费组的概念,才能在项目中把它运用好,在kafka中,每个消费者都对应一个消费组,消费者可以是一个线程,一个进程,一个服务实例,如果kafka想要消费消 ...

  8. 23年用vuex进行状态管理out了,都开始用pinia啦!

    1 Vue2项目中,Vuex状态管理工具,几乎可以说是必不可少的了.而在Vu3中,尤大大推荐我们使用pinia(拍你啊)进行状态管理,咱得听话,用就完了. 使用之前我们来看一下,使用 pinia 给我 ...

  9. 在grafana中使用不同的数据源及插件安装

    一.postgresql作为数据源 现在PG的版本是10.5(10+) 加入datasource 时只能指定一个数据库,对于监控来说可使用默认数据库postgres! 可以方便地作趋势图以及使用tab ...

  10. 实验五Elasticsearch+Kibana展示爬虫数据

    安装elasticsearch-rtf Elasticsearch-rtf相比于elasticsearch而言多加了一些插件,因此我们选择安装Elasticsearch-rtf是一个不错的选择.在安装 ...