在后端有許多的封裝方法來截取字符串或者對字符串的操作，同樣前端也有相應的方法。
有一個data數據為ipaddr
data() {
return {
ipaddr: "192.168.100.110",
};
},
1、現在需要切割成一個數組，得到四個ip值,只需要通過計算屬性就可以實現
computed：{
ipaddrArray：function(){
return this.ipaddr.split('.')
}
}
最終通過ul可以展現切割的字符串
<template>
<ul>
<li v-for="item in ipaddrArray" :key="item">{{item}}</li>
</ul>
</template>
展示的結果如下
2、替換字符。只需要將計算屬性中的return值修改即可,如下，將 ‘.' 修改成 '-‘
computed：{
ipaddrArray：function(){
return this.ipaddr.replace(/\./g,'-')
}
}
在界面展示
<template>
<ul>
<!--<li v-for="item in ipaddrArray" :key="item">{{item}}</li>-->
</ul>
{{ipaddrArray}}
</template>
展示結果如下，需要注意的是如果是特殊符號要添加 “\"轉義，否者會出錯。
3、截取某一段字符，同樣修改計算屬性，改成return this.ipaddr.substr(2,5)
意思為從第二個字符開始（應該說是第三個，因為在數組中以0開始），截取長度為5的一串字符。
視圖效果：
4、截取某一段字符，修改計算屬性，改成return this.ipaddr.substring(2,6)
意思為從第二個字符開始（應該說是第三個，因為在數組中以0開始）到第六個字符結束。
視圖效果：
以上所述是小編給大家介紹的vue如何截取字符串詳解整合，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對億速云網站的支持！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
