vue-electron / vuex-electron

Integration of Vuex and Electron
MIT License
305 stars 96 forks source link

my vue electron project store use vuex-electron cause “vuex actions” promise not working properly #23

Open huihongme opened 5 years ago

huihongme commented 5 years ago

store actions: delNotes ({dispatch, commit}, id) { return new Promise((resolve, reject) => { setTimeout(() => { resolve() }, 2000) }) }

component: [Vue warn]: Error in event handler for "on-ok": "TypeError: Cannot read property 'then' of undefined"

NoelDavies commented 5 years ago

@huihongme, I have it working fine on my local machine, can you show the code you're using? Also, have you included a plugin to allow promises to work in vuex actions?

My working setup: src/renderer/store/index.js

import Vue from 'vue'
import Vuex from 'vuex'

import { createSharedMutations } from 'vuex-electron'
import createPromiseAction from './promise-action'
import modules from './modules'

Vue.use(Vuex)

export default new Vuex.Store({
  modules,
  plugins: [
    createSharedMutations(),
    createPromiseAction()
  ],
  strict: process.env.NODE_ENV !== 'production'
})

./src/renderer/store/promise-action.js

import promiseIpc from 'electron-promise-ipc' // yarn add electron-promise-ipc

const DISPATCH = 'promise-action-dispatch'

export default (options = {}) => store => {
  function renderer () {
    store.dispatchPromise = (type, payload) =>
      promiseIpc.send(DISPATCH, {
        type,
        payload
      })
  }

  function main (store) {
    promiseIpc.on(DISPATCH, ({ type, payload }) => {
      return store.dispatch(type, payload)
    })
  }

  return process.type === 'renderer'
    ? renderer()
    : main(store)
}

Hope that helps

larbijirari commented 5 years ago

i shall just add, in the component //myComponet.vue . . . methods:{ myAjaxCall(){ this.$store.dispatchPromise('MyAction').then(.....) // instead of this.$store.dispatch('MyAction').then(.....) }

akodkod commented 5 years ago

https://github.com/vue-electron/vuex-electron/issues/44