替换模板内容 vue3

功能描述

        将文本中的占位符替换为指定的数据。在实际开发中，我们经常需要将一些预定义的文本进行动态替换，例如生成报表、邮件内容等场景。本函数提供了一种简单有效的解决方案，可以方便地实现这一需求。

参数说明

  text:需要替换占位符的字符串。

  data:用于替换占位符的数据，是一个对象数组。

返回值

      返回替换后的字符

示例

const replaceTemplates = (text: any, data: any[]) => {
  const pattern = /#(\w+)/g;
  const result = text.replace(pattern, (match: any, dynamicWord: any) => {
    return data.find((item) => item.key === dynamicWord)?.value || match;
  });
  return result;
};

// const originalText = ref("命令号#commandNumber,#startStation位置#trainNumber号车进行区间疏散，疏散方向为#endStation站。")
let originalText = computed(() => {
  let str = '命令号#commandNumber,#startStation位置#trainNumber号车进行区间疏散，疏散方向为#endStation站。';
  let data = [
    { key: 'commandNumber', value: transferForm.commandNumber },
    { key: 'startStation', value: transferForm.startStation },
    { key: 'trainNumber', value: transferForm.trainNumber },
    { key: 'endStation', value: transferForm.endStation },
  ];
  let bb = replaceTemplates(str, data);
  return bb;
});