lyyourc / vue-refetch

Fetch data for Vue component

vue-refetch

Deal with pending, error, and fullfill local state for vue component when fetch data.

Install

npm i -S vue-refetch

Usage

The template,

<div>
  <vue-refetch :src="{ userFetch }">
    <div slot-scope="{ userFetch }">
      {{ userFetch.name }}
    </div>

    <div slot="pending">
      loading...
    </div>

    <div slot="error">
      error
    </div>
  </vue-refetch>
</div>

And the scripts,

import vueRefetch from 'vue-refetch'

export default {
  components: { vueRefetch },
  methods: {
    userFetch() {
      return new Promise(resolve => {
        setTimeout(() => resolve({ name: 'foo' }))
      })
    }
  }
}