<img src> is working but when i bind it :src it's not working

Did i did anything wrong with the binding? The binded String is totally correct because when i add it in <img src="xxx/>" it totally works but when i bind it like below it show error "404 (Page not found)"

<script setup>

const props = defineProps({
  imageSrc: {
    type: String,
    required: true
  },
  imageStyle: {
    type: String,
    default: ''
  },
});

console.log(props.imageSrc);
</script>

<template>
  <img :src="imageSrc" :class="imageStyle" />
</template>

<script setup>

const props = defineProps({
  imageSrc: {
    type: String,
    required: true
  },
  imageStyle: {
    type: String,
    default: ''
  },
});

console.log(props.imageSrc);
</script>

<template>
  <img :src="imageSrc" :class="imageStyle" />
</template>

Nuxt•2y ago•

13 replies

waikit

<img src> is working but when i bind it :src it's not working

<script setup>

const props = defineProps({
  imageSrc: {
    type: String,
    required: true
  },
  imageStyle: {
    type: String,
    default: ''
  },
});

console.log(props.imageSrc);
</script>

<template>
  <img :src="imageSrc" :class="imageStyle" />
</template>

<script setup>

const props = defineProps({
  imageSrc: {
    type: String,
    required: true
  },
  imageStyle: {
    type: String,
    default: ''
  },
});

console.log(props.imageSrc);
</script>

<template>
  <img :src="imageSrc" :class="imageStyle" />
</template>

<img src> is working but when i bind it :src it's not working

Similar Threads

<img src> is working but when i bind it :src it's not working

Similar Threads

Similar Threads

Similar Threads