用多个关键字动态拆分字符串

Question

我正在研究使用角的无头CMS。

在下面的内容中，任何包装在{{ }}中的内容都被认为是一个锚链接。

We processes your data in accordance with the {{policy_placeholder}}. You have the right to object to the processing of your personal data. Check “Your rights” in the {{policy_placeholder}} and {{term_policy}} for more information.；‘

因此，使用上面的示例，下面是预期的结果

[
  {
    type: "TEXT",
    content: "We processes your data in accordance with the "
  },
  {
    type: "LINK",
    content: "{{policy_placeholder}}"
  },
  {
    type: "TEXT",
    content:
      ". You have the right to object to the processing of your personal data. Check “Your rights” in the "
  },
  {
    type: "LINK",
    content: "{{policy_placeholder}}"
  },
  {
    type: "TEXT",
    content: " and "
  },
  {
    type: "LINK",
    content: "{{terms_placeholder}}"
  },

  {
    type: "TEXT",
    content: " for more information."
  }
];

下面是我尝试过的

splitString = function(string, splitters) {
    var list = [string];
    for(var i=0, len=splitters.length; i<len; i++) {
        traverseList(list, splitters[i], 0);
    }
    const x = flatten(list);
    console.log(x);
    return flatten(list);
}

traverseList = function(list, splitter, index) {
    if(list[index]) {
        if((list.constructor !== String) && (list[index].constructor === String))
            (list[index] != list[index].split(splitter)) ? list[index] = list[index].split(splitter) : null;
        (list[index].constructor === Array) ? traverseList(list[index], splitter, 0) : null;
        (list.constructor === Array) ? traverseList(list, splitter, index+1) : null;    
    }
}

flatten = function(arr) {
    return arr.reduce(function(acc, val) {
        return acc.concat(val.constructor === Array ? flatten(val) : val);
    },[]);
}

var splitList = ["{{policy_placeholder}}", "{{term_policy}}"];
splitString(source, splitList);

问题是我必须手动添加splitList，但我想使它基于{{ }}动态化

这是如何做到的呢？

Answer 1

当您spread一个字符串时，您实际上将它拆分为字符。

​

const source = `We processes your data in accordance with the {{policy_placeholder1}}. You have the right to object to the processing of your personal data. Check “Your rights” in the {{policy_placeholder2}} for more information.`;

function splitString(str) {
  const ans = [];

  const linkTokenRegex = /\{\{.+?\}\}/g;
  const textsArr = str.split(linkTokenRegex);
  const linksArr = str.match(linkTokenRegex);

  textsArr.forEach((textPart, index) => {
    ans.push({
      type: "TEXT",
      content: textPart,
    });
    if (linksArr[index]) {
      ans.push({
        type: "LINK",
        content: linksArr[index],
      });
    }
  });
  return ans;
}

console.log(splitString(source));

​