[Vuejs]-Vue – image Url as prop not showing image

by

0👍

✅

This will help you and it’s working:

<template>
  <div id="app">
    <HelloWorld :imageSrc="logo" />
  </div>
</template>

<script>
import HelloWorld from "./components/HelloWorld";
import Logo from "./assets/logo.png";

export default {
  name: "App",
  components: {
    HelloWorld,
  },
  data: function () {
    return {
      logo: Logo,
    };
  },
};
</script>

Working Sandbox:
https://codesandbox.io/s/dark-haze-z3b7m?file=/src/App.vue:0-331

0👍

Move your assets folder into public. It should work fine.

Here’s the Demo link

From the docs

Static assets placed in the public directory and referenced via absolute paths. These assets will simply be copied and not go through webpack.

To access the static assets with absolute path, you should keep assets in public folder.

Read the documentation for more info.

Leave a comment