vuex管理页面标题
1、在store
-> mutation-types.js
文件新增常量
export const UPDATE_TITLE = 'UPDATE_TITLE'
2、新增文件title.js
目录结构如下 store
->moudules
->title.js
import * as types from '../mutation-types'
//state
export const state = {
navigationTitle : ''
}
//mutation
export const mutations = {
[types.UPDATE_TITLE](state,title){
Object.assign(state, { ...payload })
console.log(state.navigationTitle)
}
}
//actions
export const actions = {
saveTitle({commit, dispatch}, payload) {
commit(types.UPDATE_TITLE, payload)
},
}
//getters
export const getters = {
localTitle: state => {
return { ...state }
}
}
3、标题组件
<div>{{localTitle.navigationTitle}}</div>
export default {
computed:{
...mapGetters([
'localTitle'
])
},
}
4、各个页面
export default {
mounted(){
this.$store.dispatch('saveTitle',{
navigationTitle:this.title
})
}
}
vuex管理页面标题的更多相关文章
- django学习-26.admin管理后台里:修改登录页面标题,修改登录框标题,修改首页标题
目录结构 1.前言 2.完整的操作步骤 2.1.第一步:查看[site.py]的源码 2.2.第二步:在应用[hello]所在目录里的[admin.py]里重写三个属性的属性值 2.3.第三步:重启服 ...
- python 全栈开发,Day127(app端内容播放,web端的玩具,app通过websocket远程遥控玩具播放内容,玩具管理页面)
昨日内容回顾 1. 小爬爬 内容采集 XMLY 的 儿童频道 requests 2. 登陆 注册 自动登陆 退出 mui.post("请求地址",{数据},function(){} ...
- BBS--后台管理页面,编辑文章,xss攻击
1 1.对文章进行增删改查 # 后台管理url re_path(r'^cn_backend/$', views.cn_backend, name='cn_backend'), re_path(r'^c ...
- 8 功能6:后台管理页面,编辑文章,xss攻击
1.后台管理页面之文本编辑 # 后台管理url re_path(r'^cn_backend/$', views.cn_backend, name='cn_backend'), re_path(r'^c ...
- app端内容播放,web端的玩具,app通过websocket远程遥控玩具播放内容,玩具管理页面
一.app端内容播放 下载代码 https://github.com/987334176/Intelligent_toy/archive/v1.0.zip 注意:由于涉及到版权问题,此附件没有图片和音 ...
- 老男孩Day16作业:登录、注册、后台管理页面(动态)
一.作业需求: 1.后台管理主界面(左边菜单框.(全选.反选)框.返回顶部按钮) 2.老男孩登录.注册页面 二.博客地址:https://www.cnblogs.com/catepython/p/93 ...
- Django(四) 后台管理:创建管理员、注册模型类、自定义管理页面显示内容
后台管理 第1步.本地化:设置语言.时区 修改project1/settings.py #LANGUAGE_CODE = 'en-us' LANGUAGE_CODE = 'zh-hans' #设置语言 ...
- Bootstrap <基础二十三>页面标题(Page Header)
页面标题(Page Header)是个不错的功能,它会在网页标题四周添加适当的间距.当一个网页中有多个标题且每个标题之间需要添加一定的间距时,页面标题这个功能就显得特别有用.如需使用页面标题(Page ...
- 解决Django站点admin管理页面样式表(CSS style)丢失
参照这篇教程激活完django自带服务器的admin管理页面后,照着教程所描述的那样,尝试打开http://127.0.0.1:8000/admin/,发现自己的浏览器显示如下 很明显可以看出,虽然业 ...
随机推荐
- 大数据学习--day08(hnapp 后台系统开发、面向对象)
hnapp 后台系统开发.面向对象 利用前面所学的知识,写一个控制台登陆注册后台界面 package sy180918.hnapp.array; import java.util.Arrays; im ...
- python--模块之time,datetime时间模块
time: 表示时间的三种方式:时间戳.格式化的时间字符串.元组时间戳是计算机能够识别的时间:时间字符串是我们能够看懂的时间:元组是用来操作时间: 导入时间模块import time 1,时间戳(ti ...
- AS 3.1 项目打包成jar或aar
1.首先明白一个道理. Android Studio编译的时候会自动将项目生成jar和aar的,我一开始以为jar需要自己单独生成,其实AS已经自动生成了,网上找的很多资料都是一个复制的过程而已. 只 ...
- [WebService] 使用httpWebrequest 调用并调试WebService
使用httpWebrequest 调用并调试WebService. 首先 使用httpWebrequest 调用WebService 代码: using System.Net; ...
- 北京Uber优步司机奖励政策(4月7日)
滴快车单单2.5倍,注册地址:http://www.udache.com/ 如何注册Uber司机(全国版最新最详细注册流程)/月入2万/不用抢单:http://www.cnblogs.com/mfry ...
- spring源码-BeanPostProcessor-3.3
一.BeanPostProcessor这个是spring容器的拓展之一,是用于获取bean的时候处理对应的对象: 二.常用场景,在获取bean的时候,重新初始化bean的属性等. 三.实现方式(加入容 ...
- 机器学习的5种“兵法"
大数据文摘作品,欢迎个人转发朋友圈,自媒体.媒体.机构转载务必申请授权,后台留言“机构名称+转载”,申请过授权的不必再次申请,只要按约定转载即可. 作者:Jason Brownlee 译者:Clair ...
- beauifulsoup模块的介绍
01 爬虫基础知识介绍 相关库:1.requests,re 2.BeautifulSoup 3.hackhttp 使用requests发起get,post请求,获取状态码,内容: 使用re匹 ...
- Allure--自动化测试报告生成
之前尝试使用过testNG自带的测试报告.优化过reportNG的测试报告,对这两个报告都不能满意.后经查找资料,发现有个神器: Allure(已经有allure2了,笔者使用的就是allure2), ...
- ReadyAPI教程和示例(一)
声明:如果你想转载,请标明本篇博客的链接,请多多尊重原创,谢谢! 本篇使用的 ReadyAPI版本是2.5.0 通过下图你可以快速浏览一下主要的ReadyAPI中SoapUI功能: 一.创建一个功 ...