javascript - 如何在 Vuex/Nuxt 中设置值

Question

我是 Vuex 和 Nuxt 的新手。

我想使用 vuex 来获取 dropbox 文件结构并存储它们。

这是我的代码。 console.log 似乎工作正常。它打印出如下内容。

但是当我在index.vue中使用时结构仍然是[]

[ { '.tag': 'file',
    name: 'Document.docx',
    path_lower: '/posts/document.docx',
    path_display: '/posts/Document.docx',
    id: 'id:H_6Dhj1r7cEAAAAAAAAXlQ',
    client_modified: '2018-09-02T14:23:05Z',
    server_modified: '2018-09-02T14:23:06Z',
    rev: '5e5cab150',
    size: 11366,
    content_hash: 'd26bb0382752820694d31f42e82e31ef72bed683b90e02952ea09125264d4124' },
  { '.tag': 'file',
    name: '2013-5-17-first-post.md',
    path_lower: '/posts/2013-5-17-first-post.md',
    path_display: '/posts/2013-5-17-first-post.md',
    id: 'id:H_6Dhj1r7cEAAAAAAAAXlg',
    client_modified: '2018-09-02T14:25:38Z',
    server_modified: '2018-09-02T14:25:38Z',
    rev: '6e5cab150',
    size: 136,
    content_hash: '3b8d60de425e8280d55e45d7359cd3290abc5bc3b0bb6831b09a6da0d3cb6a12' } ]

代码如下

import "isomorphic-fetch"
import {
  Dropbox
} from "dropbox";
import {
  DropboxTeam
} from "dropbox";
export const state = () => ({
  structure: []
});
export const mutations = {
  setStucture(state, structure) {
    state.structure = structure.slice();
    console.log(state.structure);
    // console.log(structure.slice());
  }
};
export const actions = {
  async nuxtServerInit({ commit }) {
    let accessToken = "XXXXX"
    let dropbox = new Dropbox({
      accessToken: accessToken
    });
    dropbox.filesListFolder({path: '/posts'})
    .then(response => {
      const structure = response.entries;
      commit("setStucture", structure);
    })
    .catch(error => {
      console.log(error);
    });
  }
};

我能得到一些帮助吗？谢谢!

Answer 1

将 await 添加到 dropbox.filesListFolder({path: '/posts'}) 如下所示，结果证明这是正确的答案。

await dropbox.filesListFolder({path: '/posts'})