vue中通过js把从接口取到的url中的{}里的参数替换成对应的值

最近工作中遇到个需求,首先在一个页面中给按钮配置个点击跳转的链接,手动输入需要跳转的url及其需要的参数,后续要在另一个页面中通过接口取到配置的这个url,并替换掉当中的参数,第一次处理这种情况,所以记录一下

前端页面配置url,参数值通过{}包裹占位

后续在适配页面通过接口取到配置的url并替换当中的参数

1.首先通过正则匹配找到所有的参数数组

2.然后通过遍历参数数组,对数组值去掉外层大括号,最后将url中{FLOWID}替换为FLOWID对应的值

var array = []
var row={
 FLOWID:'erf343wfdfdas',
 FLOWFORMID:'fjiwoqiuo3829038fashkda'
}
var url='/lc/fiveTuple/testPage?flowId={FLOWID}&formId={FLOWFORMID}'
array = url.match(/{(.*?)}/g) //结果:['{FLOWID}', '{FLOWFORMID}']
if (array && array.length) {
  array.forEach(val => {
     var val1 = val.substring(1, val.length - 1)
     url = url.replace(val, row[val1])
  })
}
console.log(url)  //结果:/lc/fiveTuple/testPage?flowId=erf343wfdfdas&formId=fjiwoqiuo3829038fashkda

猜你喜欢

转载自blog.csdn.net/WYB_BOOM/article/details/131019355