vueテキストが非表示の展開を超えて閉じます


vueテキストが非表示の展開を超えて閉じます
まず、非表示にする必要があるコンテンツブロックに固定高さを書き、非表示にする必要があります.
	<div		
        //class="checkboxHeight"// overflow:hidden;             ...   
          :style="{height:showMore?'auto':showHeight+'px'}"
        >
        <p ref="ref">  </p>
     </div> 
      <a-button
          type="link"
          v-show="isLongContent"
          style="float:right;"
          @click.stop="showMore2"
        >
          {{showMore?'  ':'  '}}
          <a-icon v-if="!showMore" type="down" />
          <a-icon v-else type="up" />
        </a-button>

showMore:false showHeight:20//テキストデフォルト高さisLongContent:false//展開終了ボタンデフォルトは表示されません
 this.$nextTick(() => {
          //const contentHeightThreshold = 20;
          let contentHeight = this.$refs.checkbox[3].$el.clientHeight;
          if (contentHeight > showHeight) {
            this.showHeight = showHeight;
            this.isLongContent = true;
          } else {
            this.isLongContent = false;
          }
   });

domのロードが完了した後にrefを通じてdivの本当の高さclientHeightを取得します