javascript - 如何在 vuex 日志中隐藏下一个状态和上一个状态？

Question

下面是我初始化 vuex 的方式:

Vue.use(Vuex);
const store = new Vuex.Store({
  plugins: [createLogger({logger: console, collapsed: true})],
  strict: true,
  state: state,
  getters: getters,
  mutations: mutations,
  actions: actions,
});
Vue.prototype.$store = store;
export default store;

我得到的日志是这样的:

'mutation ADD_VIDEO_CREDIT @ 15:53:13.903'

'%c prev state' 'color: #9E9E9E; font-weight: bold' { profile: // a huge pile of text

'%c mutation' 'color: #03A9F4; font-weight: bold' { type: 'ADD_CREDIT', payload: {credit: 4} }

'%c next state' 'color: #4CAF50; font-weight: bold' { profile: // another huge pile of text

在我的梦里我只想得到:

type: 'ADD_CREDIT', payload: {credit: 4}

我知道什么是关闭？

Answer 1

createLogger 函数需要几个函数，您可以使用过滤器函数覆盖实际的变异结果以所需格式打印在控制台中

Vue.use(Vuex);
const store = new Vuex.Store({
  plugins: [
   createLogger({
  logger: console,
  collapsed: true,
  filter (mutation, stateBefore, stateAfter) {
    console.log(mutation);
    return false;
  },
}),
],
  strict: true,
  state: state,
  getters: getters,
  mutations: mutations,
  actions: actions,
});
Vue.prototype.$store = store;
export default store;