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
            })
        }
    }
    
  • 相关阅读:
    3.10 Go Map哈希表
    3.9 Go Slice切片
    3.8 Go Array数组
    3.7 Go指针
    3.6 Go String型
    3.5 Go布尔型
    3.4 Go字符型
    3.3 Go浮点型
    3.2 Go整数类型
    3.1Go变量
  • 原文地址:https://www.cnblogs.com/littleBit/p/8994682.html
Copyright © 2011-2022 走看看