js将字符串中竖线字符“|”替换

对后台返回的字符进行检索是否含有竖线字符“|”，有的话替换成图片和文字，点击图片和文字要支持跳转，并把当前列表的信息带到跳转的页面。
实现方式：
第一种：只考虑有一个竖线，可以考虑split方法
思路：用split将字符串分成两段，在页面中进行拼接。
split切割返回的是一个数组，所以通过数组下标的方式取值

比如说后台返回的字段内容如下：
let str = “我觉得杰德的|是啊很多时间话点击啥都好说”

在页面结构中展示
<div>
	<span>{{str.split("|")[0]}}</span>
	<span @click="handleToPage(str,id)">
		<img src="" alt="">
	</span>
	<span>{{str.split("|")[1]}}</span>
</div>

第二种：要是考虑竖线不止一个的话，考虑substring方法
思路：substring将第一个竖线字符的前面的字符截取到，+1是为了把第一个竖线跳过去，replace将剩下的字符串中的竖线全部替换掉，这里注意下竖线的表示前面要加’'，/g是表示全局替换。

<div>
	<span>{{str.substring(0,str.indexOf('|'))}}</span>
	<span @click="handleToPage(str,id)">
		<img src="" alt="">
	</span>
	<span>{{str.substring(str.indexOf('|')+1).replace(/\|/g,'')}}</span>
</div>

最近项目中遇到的问题，记录一下！有更好的方法，欢迎下方留言交流~