The way to separate logic code of the Vuejs component into smaller files
With a huge component, we need to saparate that component into smaller files (data, methods, computed...) and import in to the main file to easy to develop like this:
Data:
Methods:
Computed:
Import into component:
Data:
// data.js export default function() { return { // xyz } }
Methods:
// methods.js export default { methodA () { // xyz }, methodB () { // xyz } //... }
Computed:
// computed.js export default { aComputed() { // xyz }, bComputed() { // xyz }, }
Import into component:
// component.vue import methods from './methods'; import data from './data'; import computed from './computed'; export default { data, methods: { ...methods, // local methods }, computed: { ...computed, // local computed } }
Latest
© 2019 4codev
Created with love by Sil.