Complete Vue.js 2 Web Development_ Practical guide to building end-to-end web development solutions with Vue.js 2

(singke) #1

Caching the Current Folder Structure Using Vuex Chapter 6


template: '#dropbox-viewer-template',
data() {
return {
accessToken: 'XXXX',
structure: {},
isLoading: true
}
},
computed: {
path() {
return this.$store.state.path
},
slug() {
return this.path.toLowerCase()
.replace(/^\/|\/$/g, '')
.replace(/ /g,'-')
.replace(/\//g,'-')
.replace(/[-]+/g, '-')
.replace(/[^\w-]+/g,'');
}
},
methods: {
dropbox() {
return new Dropbox({
accessToken: this.accessToken
});
},

createFolderStructure(response) {

const structure = {
folders: [],
files: []
}

for (let entry of response.entries) {
// Check ".tag" prop for type
if(entry['.tag'] == 'folder') {
structure.folders.push(entry);
} else {
structure.files.push(entry);
}
}
this.structure = structure;
this.isLoading = false;

},
Free download pdf