[Vuejs]-How to use vue to achieve a click to make the input box bigger

2๐Ÿ‘

โœ…

so first off try to keep code on stackoverflow. e.g. in your question.

<div id="myApp">
   <textarea placeholder="pleace enter you message" :class="['message', expand_message ? 'expand_message' : null]"></textarea>
   <button @click="btnClick">click</button>
</div>

And to get your animation, you can not transition on height however you can transition on max height:

.message{
  display: block;
  max-height: 40px;
  height: 300px;
  transition: max-height ease-out 1s;
}

.expand_message{
  max-height: 300px;
}
๐Ÿ‘คMichael Mano

1๐Ÿ‘

Try this:

:class="{'expand_message': expand_message}"
๐Ÿ‘คVasile Radeanu

Leave a comment