使用后端接口遇到的问题
2020-05-30 本文已影响0人
一只菜鸟正在脱毛
1.获取图片 提取富文本第一张图片url 在main.js中写入
Vue.prototype.getImgUrl =function (str) {
let data = '';
str.replace(/<img [^>]*src=['"]([^'"]+)[^>]*>/, function (match, capture) {
data = capture;
});
return data
}
1.1.遍历后端发出的数组
![](https://img.haomeiwen.com/i22948961/573f119675e88af2.png)
1.2.在结构标签上循环数组
![](https://img.haomeiwen.com/i22948961/2f27ae3b9997b415.png)
1.3.获取后端发出的图片
![](https://img.haomeiwen.com/i22948961/a0114aa23535e461.png)
2.去除一些多余的元素 正则表达式 在main.js写入
// 新闻中心
Vue.prototype.formatWord = function (str) {
str = str.replace(/<\/?[^>]*>/g,''); //去除HTML tag
str = str.replace(/[ | ]*\n/g,'\n'); //去除行尾空白
str = str.replace(/\n[\s| | ]*\r/g,'\n'); //去除多余空行
str = str.replace(/ /ig,'');
str=str.replace(/ /ig,'');//去掉
str = str.substring(0, 30);//截取文字多少位
str += '...'
return str;
}
2.1和上面一样,遍历数组之后在所要绑定的标签上遍历
![](https://img.haomeiwen.com/i22948961/ea2bac184e5110b0.png)