0

Estoy probando Vuejs con laravel mix.

Acabo de crear mi component se llama HeaderComponent.vue, lo estoy renderizando bien se me muestra en el home de la pagina pero quiero hacer lo siguiente:

<template>
    <div>
        <!-- Just an image -->
        <nav class="navbar">
            <a class="navbar-brand" href="#">
                <img :src="{{ img }}" alt="Mercantil Logo" />
            </a>           
        </nav>
    </div>
</template>

<script>
  export default {
    data: function() {
      return {
        //Quiero que la ruta que escriba aqui se renderice en el template
        img: "img/menu/1.png"
      };
    }
  };
</script>

<style lang=""></style>

Como escribí en el comentario del código quiero que lo que escriba en img se renderice en el src de la imagen, pero me da error, como debo hacerlo?

1
  • ¿Qué error te da?
    – user128299
    Commented el 30 jul. 2020 a las 17:42

1 respuesta 1

1

Al usar :src="" (equivalente a vbind:src="") no necesitar encerrar la expresion entre {{ }} usalo directamente

<img :src="img" alt="Mercantil Logo" />

https://v2.vuejs.org/v2/guide/syntax.html#Attributes

2
  • 1
    Ojo vuejs ya va en la versión 2 y próximo la 3, deberías recomendarle doc actualizada
    – user128299
    Commented el 30 jul. 2020 a las 17:55
  • Actualmente Laravel sigue trabajando con la versión 2, así que voy bien con ella, muchas gracias. Commented el 30 jul. 2020 a las 18:53

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.