javascriptvue.jsvuejs2vue-componentnuxt.js

How to convert some Nuxt code into some Vue?


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


Solution

  • 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>