Problem , nie dział poprawnie zwiekszanie długość texarea w vue.js [ankieta]

Question

Mam problem z bindowaniem wysokość miedzy stylem ustalonym w obiekcie Vue.js  a :style . chciałbym dynamicznie zmieniać wysokość textarea  podczas zdarzenia scroll . to podaje mój kod

  <textarea id="textarea" @scroll="focusTextarea" :style="styleObject" col="5" class="styleinput textarea" type="text"  />
        <br>
            <button class="btn btn-primary"  :class="{'isLoading': isLoad }" >Wyslij</button>
              </form>
              <div v-if="isLoad" class="toast">
                  dziekujemy za wystałnie Formularza
                  </div>
</div>
</template>

<script>
// pierwsza opcja jest nie praktyczna//
let tab2 = [];
/// end ///

export default {
    
name : "formularz",

data(){

return {

isLoad : false,

styleObject: {

height : 45


 }
}


},

watch :{

styleObject(old ,newV){


}


},

methods:{

focusTextarea:function(e){

console.log(e);

let curenValue;

let element =  document.querySelector("#textarea");

let newValue = element.scrollTop;

curenValue = newValue;



tab2.push( newValue);

//.log(`to jest nowa warosc ${newValue} to jest stara warosc ${curenValue} warosc tablicy ${tab2}`);

//console.log( tab2);

//console.log(element.scrollHeight);

//console.log(tab2[tab2.length-1])



if( tab2[tab2.length-2] == undefined  ){

this.styleObject.height += 5;


this.convert(this.styleObject.height);
console.log("+");

} if(tab2[tab2.length-1] > tab2[tab2.length-2] ){

console.log("+");
 this.styleObject.height += 5;


this.convert(this.styleObject.height);

}else if( tab2[tab2.length-1] < tab2[tab2.length-2] ){

console.log("-")

 this.styleObject.height -= 5;
this.convert(this.styleObject.height);

}

if( tab2[tab2.length-1] == 0 ){

tab2.splice(tab2.lenght-1);

console.log(tab2);

}





   },
convert : function(value){



}
 
 }
}

 

Brak odpowiedzi!