使用Vue文本插值當文本溢出時如何自動換行

當我們使用vue文本插值即兩個大括號時，有時候會出現文本溢出的情況，如下圖

 

代碼采用如下：

{{severShow.vpnKey}}

此時我們可以使用如下css屬性

html：

<div class="text-wrapper">{{severShow.vpnKey}}</div>

css：

.text-wrapper {
  word-break: break-all;
  word-wrap: break-word
}

效果：

 

轉載地址