Vuetable-2: how to use vuetable-2 at local JSON file ?

[kawamataryo]

Hello.

I want to use it at local JSON file.
I try this code.

<template>
  <vuetable ref="vuetable"
      api-url="../assets/test.json"
    :fields="fields"
  ></vuetable>
</template>

<script>
import Vuetable from 'vuetable-2/src/components/Vuetable'

export default {
  components: {
    Vuetable
  },
  data () {
    return {
      fields: [
        'name', 'email', 'birthdate',
        'address.line1', 'address.line2', 'address.zipcode'
      ]
    }
  }
}
</script>

file file structure.

Bad out this error.

please tell me how to use it at local JSON file.

thank you.

[cristijora]

If you want to use assets in vue-cli the best idea is to place them in the static folder. Move your json into static folder and request it with /static/test.json

[ratiw]

@kawamataryo You will have to use Data mode by setting api-mode to false, then supply your own local data via data prop. See this codepen.

You can also combine with what @cristijora has suggested to make your code cleaner.

Please be aware, though, that sorting, paging, and page sizing are not yet work in this mode.

<vuetable
  :api-mode="false"
  :data="localData"
></vuetable>

[kawamataryo]

@ratiw @cristijora Thank you so much. I'll try it.