How to convert some Nuxt code into some Vue?

user_18198067 0
Viewed 91

How can I convert this Nuxt script into a Vue compatible one?

<script>
export default {
  components: {
    FeaturedProduct
  },
  async asyncData({ $axios }) {
    try {
      let response = await $axios.$get(
        'http://localhost:5000/api/products'
      )

      console.log(response)
      return {
        products: response.products
      }
    } catch (error) {}
  }
}
</script>

How can I go about it in Vue? If I remove the $ it gives me an error saying

axios not defined

vuejs2 nuxt.js vue-component vue.js javascript
1 Answers

This would be the syntax in Vue (assuming you've installed axios for Vue)

<script>
export default {
  async created() {
    try {
      let response = await this.axios(
        'http://localhost:5000/api/products'
      )

      console.log(response)
      this.products = response.data.products
    } catch (error) {}
  }
}
</script>

A working example could be found here: https://github.com/kissu/vue2-axios/blob/master/src/App.vue

user_88165850
Related