0

Estou com um problema no meu projeto com Vue. quando passo um array como props para meu outro componente, este mesmo ao dar um console.log() ele printa um observer, mas nao o array que passei p ele.

this.valores = [1,2,3,4,5];

componente:

<spark-line :type="'line'" :data="this.valores" :height="'60'" :width="'100%'" :lineColor="'#1ab394'" :fillColor="'#ffffff'"></spark-line>

Mas no js o resultado é um observer, e nao um array

js:

export default {

    props:['type','data','height','width','lineColor','fillColor'],
    mounted: function(){
        console.log(this.data);

        $('#sparkline').sparkline(this.data, {
               type: this.type,
               width: this.width,
               height: this.height,
               lineColor: this.lineColor,
               fillColor: this.fillColor
         });

    }
}

Print do console

Alguem sabe o que pode ser?

Mas se eu colocar assim funciona:

export default {

    props:['type','data','height','width','lineColor','fillColor'],
    mounted: function(){
        console.log(this.data);

        $('#sparkline').sparkline([1,2,3,4], {
               type: this.type,
               width: this.width,
               height: this.height,
               lineColor: this.lineColor,
               fillColor: this.fillColor
         });

    }
}

1 Resposta 1

0

Resolvido, na vdd o problema estava na chamada da funcao no componente, ele montava o componente com o valor default passado no componente pai, que inicializava com this.valores = [], dai quando montava o componente o jQuery era acionado com a variavel inicializada vazia, entao os valores passados depois nao surtiram efeito, resolvido com o watch:

export default {

props:['type','data','height','width','lineColor','fillColor'],
watch: function(){

    $('#sparkline').sparkline(this.data, {
           type: this.type,
           width: this.width,
           height: this.height,
           lineColor: this.lineColor,
           fillColor: this.fillColor
     });

}

}

onde o mesmo observa quando o props data muda.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .