引入 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. GIT安装及IDEA配置(GIT)

    参考:https://blog.csdn.net/qq_40563761/article/details/91347443 1.安装git 2.idea下载GITHUB/GITEE插件 3.idea配 ...

  2. maven打包失败 Cannot create resource output directory

    转https://blog.csdn.net/wuyuanshun/article/details/103097447 maven clean后打包出现Cannot create resource o ...

  3. 一文看懂 Python 中的函数参数

    函数定义中的参数也就是形式参数,规定了在调用函数时如何传递实际参数以及这些参数有无默认值. 实参传递方式 def f(a): print(a) 实参传递方式有两种,位置和关键字.对于上面定义的函数 f ...

  4. vue3和vue2的区别

    一.Vue3介绍 Vue 新版本的理念成型于 2018 年末,当时 Vue 2 的代码库已经有两岁半了.比起通用软件的生命周期来这好像也没那么久,但在这段时期,前端世界已经今昔非比了 在更新(和重写) ...

  5. React Hooks的理解,React Hooks有哪些,解决了什么问题

    一.是什么 Hook 是 React 16.8 的新增特性.它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性 至于为什么引入hook,官方给出的动机是解决长时间使 ...

  6. XAMPP环境下数据库密码保存文件目录(数据库密码忘记)

    转自百度经验: https://jingyan.baidu.com/article/09ea3ede4e2523c0afde3943.html ---------------------------- ...

  7. Python 生成多个空列表 空List 空数组方法

    生成多个空列表在统计一些参数时候,需要生成多个空List,此时直接办法是: a = [] b = [] c = [] d = [] ... 简洁办法为: a, b, c, d = [[] for i ...

  8. Java 文本检索神器 "正则表达式"

    Java 文本检索神器 "正则表达式" 每博一文案 在我们短促而又漫长的一生中,我们在苦苦地寻找人生的幸福,可幸福往往又与我们失之交臂, 当我们为此而耗尽宝贵的.青春年华,皱纹也悄 ...

  9. 腾讯云对象存储 COS搭建个人网站

    腾讯云对象存储 COS搭建个人网站,简单易操作,方便快捷.   只需要将你的网站资源上传即可,然后设置上你的自定义 CDN 加速域名,一个个人网站就上线啦!当然,你也可以不用设置自定义 CDN 加速域 ...

  10. ABP微服务系列学习-使用Tye启动微服务

    Tye是微软开源的一款开发人员工具, 能够用于简化微服务以及分布式应用程序的开发.测试以及部署过程.Tye 的首要目标是简化微服务的开发,具体方式包括仅用一行命令执行多项服务.在容器中使用依赖项目,以 ...