<div id="app">
  <div class="panel">
    <b>Какой-то заголовок</b>
    <expansion :show='content'>
      <p>Какой-то текст Какой-то текст Какой-то текст Какой-то текст Какой-то текст Какой-то текст Какой-то текст Какой-то текст Какой-то текст Какой-то текст Какой-то текст Какой-то текст Какой-то текст Какой-то текст Какой-то текст </p>
    </expansion>
  </div>
  <br>
  <button @click='content = !content'>переключить</button>
</div>

.panel{
  max-width: 400px;
  box-shadow:14px 0px 17px 0px rgba(50, 50, 50, 0.75);
  padding: 20px;
}
.expansion {
  overflow: hidden;
  transition: height 1s;
}

Vue.component('expansion', {
  props: ['show'],
  computed: {
    style() {
      return `height: ${this.show ? this.$el.scrollHeight : 0}px`; 
    }
  },
  template: `
    <div class="expansion" :style="style">
      <slot/>
    </div>
  `
});

new Vue({
  el: '#app',
  data: {
    content: false
  }
})