DEV Community

Cover image for How to pass dynamic image url in nuxt project . Ultimate Guide .
Dimer Bwimba
Dimer Bwimba

Posted on • Edited on

How to pass dynamic image url in nuxt project . Ultimate Guide .

As the src properties will replaced by Webpack, you could do require function like this 

<templae> <div> <img :src="imageUrl"> </div> </template> <script> export default { props: { imageUrl: { type: String, default: '' } } } </script>
Enter fullscreen mode Exit fullscreen mode

*ParentComponent.vue 

<template> <ChildComponentExample :image-url="require('~/assets/myimage.png')" /> </template>
Enter fullscreen mode Exit fullscreen mode

This blog post explains how this works .:) Happy Code :)

Top comments (0)