Using v-parallax vuetify with a prop to display an asset URL (it's a recommended hack..)
<v-parallax :src="parallaxUrl()">
methods: {
parallaxUrl() {
return require("@/assets/images/hero.jpeg");
},
I get the image displayed correctly, BUT running test:unit , I aslo get a warning , as the v-parallax require a string and not an object... The test pass correctly ( it's only a warning..) , however is there a way to get rid of this warning ?
thanks for feedback
Test .default :
return require("@/assets/images/hero.jpeg").default;
When you require an file, it returns the data content of that file. For images it returns a Blob object. And since the definition of src prop in v-parallax states that the value of src should be a string (the path to the image), Vue will throw that warning message.
To remove the warning message, you can update the definition of src in v-parallax to accept both an Object and a string.
props: {
src: [String, Object]
}
OR
You can return the path of the image instead of returning the data within the image.
<v-parallax :src="parallaxUrl()">
methods: {
parallaxUrl() {
return "./assets/images/hero.jpeg"
},
}
https://v2.vuejs.org/v2/guide/components-props.html#Prop-Types
https://webpack.js.org/guides/asset-management/
