Saltar al contenido

Cómo vincular img src a datos en Vue

Solución:

Si estas usando vue-cli hay que recordar que todo se procesa como un módulo, incluso las imágenes. Necesitarías usar require si la ruta es relativa en JS, así:

{ name: 'test1', src: require('../assets/logo.png') }

Puede encontrar muchos más detalles sobre esto aquí: http://vuejs-templates.github.io/webpack/static.html

simplemente para vincular img src a los datos, solo requiere el dirección de archivo :

<img v-bind:src="https://foroayuda.es/require("../image-address/' + image data)" />

ejemplo a continuación muestra ../assets/logo.png:

<template>
          <img v-bind:src="https://foroayuda.es/require("../assets/' + img)" />
</template>

<script>
export default {
  data: function() {
    return {
      img: "logo.png"
    };
  }
};
</script>
¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *