zoukankan      html  css  js  c++  java
  • 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
            })
        }
    }
    
  • 相关阅读:
    查询父节点parentNode
    008-流程控制 case 语句
    007-流程控制 if 语句
    006-条件判断
    005-sort 命令使用
    004-sed 命令使用
    003-awk 命令使用
    002-printf 命令用法
    001-cut 的用法
    002-变量
  • 原文地址:https://www.cnblogs.com/littleBit/p/8994682.html
Copyright © 2011-2022 走看看