0

soy nuevo en vuejs y me surgió el siguiente problema al renderizar un objeto con el metodo v-for el contenido no respeta el max-width de css ni las col de boostrap... alguna idea ?

<div class="pre-scrollable" style="height:120px;" >
        <div class="container">
          <div class="row">
              <div class="col-md-4" v-for="item in respuestas" >
                <p>Lorem ipsum dolor sit amet, consectetur adip</p>
                <p v-bind:class="[test]">{{item}} </p>
          </div>
        </div>
      </div>
    </div>

screenshot del problema

1
  • Si el valor de item es un string sin espacios, va a intentar meterlo todo en el mismo div en una sola línea. Si no puedes separar ese texto con espacios, puedes probar dándole overflow: hidden al contenedor, pero eso te funcionará siempre y cuando éste o uno de los padres tenga un ancho fijo o un max-width en pixeles (no en porcentaje)
    – ffflabs
    el 25 jul. 2018 a las 23:31

1 respuesta 1

0

Intenta usar el v-for en un template:

<template v-for="item in respuestas">
  <div class="col-md-4">
    <p>Lorem ipsum dolor sit amet, consectetur adip</p>
    <p v-bind:class="[test]">{{item}} </p>
  </div>
</template>

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

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