Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

can't access vuex modules #39

Closed
you06 opened this issue Aug 3, 2018 · 3 comments
Closed

can't access vuex modules #39

you06 opened this issue Aug 3, 2018 · 3 comments

Comments

@you06
Copy link

you06 commented Aug 3, 2018

Hi,
I'm integrating this tool with Vuex, and have the following problem.
According to the documents, integrated with Vuex should pass Vuex store object into treeOptions

The file tree looks like this (see also github repo)

.
├── components
|   ├── common
|   |   └── Filetree.vue
|   |   └── ...
|   └── ...
├── store
|   ├── modules
|   |   ├── Filetree.js
|   |   └── ...
|   └── index.js
└── ...

When I create several modules, the states of each modules are separated but the mutations are mixed. It seems unable to get a Vuex store object.

In my understanding, this plugin will copy the reference of its data into Vuex state in initTree mutation. Can I pass only listened state property and some actions(or mutations) into tree options? So that I can visit the required objects from Vue file via mapState, mapActions and mapMutations.

@amsik
Copy link
Owner

amsik commented Aug 3, 2018

Hi! It is not implemented yet. So you cannot use Vuex modules

@amsik
Copy link
Owner

amsik commented Aug 3, 2018

Ohh, I'm sorry. You able to get the data from the modules... See the example:

Your store (from your example)

export default new Vuex.Store({
  modules: {
      reading: {
          state: {}, // ....
          mutations: {},
          actions 
      },

      filetree: {
          state: {
              treeData: []
          },
          mutations = {
            initTree(state, treeData) {
                state.treeData.push(...treeData)
            },
            updateTree(state, newData) {
                state.treeData = newData
            }
          }
      }
  },

  getters: {
      tree(state) {
        return state.filetree.tree  // reads 'tree' state from `filetree` module
      }
  },

  strict: process.env.NODE_ENV !== 'production'
})

liquor-tree options:

treeOptions: {
          paddingLeft: 10,
          store: {
            store: this.$store,
            getter: 'tree', // ~~~  use `getter` instead of `key`
            mutations: ['initTree', 'updateTree']
          }
        }

@you06
Copy link
Author

you06 commented Aug 3, 2018

@amsik thanks for your demo!
Set getter in tree options works, however, the mutations in vuex modules seems will not be executed.
I'm currently using mapMutations and event trigger to execute mutation in vuex modules.

btw, a quotation mark is missing in vuex document page line 21.
image

Cool tree display tool!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants