aarondfrancis / vue-model

Model component for Vue.js
MIT License
855 stars 42 forks source link

How do you deal with storing multiple models from index() action? #29

Open windbridges opened 5 years ago

windbridges commented 5 years ago

Hello! This is really cool library with no alternatives. But I'm stuck with understanding how index() action works. Server should return an array of items. As result I get model having numeric properties like 0,1,2,3 etc. together with regular model properties in one object. Also I see only one call and realization of apply() method in sources, that means only single data item applying is supported.

Could you help me with understanding how index() action should work?

omnichronous commented 4 years ago

Edit: I think the intended way to use index() is to just capture the result of the call:

async function getItems () {
    const response = await this.$model('item').http.index()
    this.items = response.data
}

If you enable apply on the index() action then you do get the results as numeric properties in your model. That's not very nice, but it can be handled like this:

A lodash one-liner to filter out the model properties:

_.filter(obj, (item, key) => _.isInteger(parseInt(key)))

I usually do this in a computed property, like so:

data () {
    return {
      article: this.$model('item')
    }
  },

  computed: {
    itemList () {
      return _.filter(this.item, (item, key) => _.isInteger(parseInt(key)))
    }
  },

And then in templates etc. I just use the computed property instead of the raw model.

Hope this helps.