Vue js平滑动画高度

Question

这是我的剧本

export default {
  name: 'Header',
  data () {

    return {
     list_open_1: false
    }
  },
   methods: {
    list_open(){
     this.list_open = true
    }
  }
}

这是我的HTML

<li class="work"> <button v-on:click=" list_open_1 = !list_open_1">Работа</button>
      <transition name="SlideDown">
       <ul class="work-in" v-if=" list_open_1">
        <li>Вакансии</li>
        <li>Резюме</li>
        <li>практика</li>
       </ul>
      </transition>
     </li>

我需要在发生时平滑地将块的高度从0改为100％并返回