Javascript 在Vue筛选器内的HTML之间换行文本

在vuejs中，是否可以将文本的某些部分包装到HTML标记中

比如你好，约翰。你好吗？ 成为Hello%John%。你好吗

用一个过滤器

{{text | wrapText}}

我从未与vue合作过，但在过去15分钟里我读了一点，我想我找到了一个解决方案

您可以使用javaScript方法。可能有更干净的方法来实现相同的结果

重要的事实是将vue自定义过滤器与：inner-html.prop一起使用。它看起来不太“安全”，但如果你控制html插入的内容，你应该可以

因此，在html中，您可以执行以下操作

然后声明你的过滤器。我了解到有两种方法可以声明它们：全局声明或组件内部声明，由您选择

全球

Vue.filter('wrapText', function (value) {
  const wordToWrap = value.substring(
    value.indexOf("%")+1, 
    value.lastIndexOf("%")
  )

  const wrappedWord = `<b>${wordToWrap}</b>`

  value = value.replace(wordToWrap, wrappedWord)

  return value;
})

这应该行得通。我让它在vue运动场上工作。

---

干杯

您可以编写自己的筛选器。看到这个了吗

正则表达式就是这样：D

编辑：2.0过滤器仅适用于小胡子标签和v-bind

cfr:

新Vue{ el:应用程序， 数据：{ 文字：“你好%John%.你今天好吗%？” }, 过滤器：{ wrapTextstr{ 返回此.wrapTextstr } }, 方法：{ wrapTextstr{ 如果str.包含“%”{ 常数reg=/%[A-Za-z0-9]*%/g const newStr=str.replacereg，'$1' 返回新闻 } 返回str } } } 这是一篇课文

---

你看了吗？是的，但是没有提到正则表达式的htmlgood思想。问题不在于过滤器，而在于如何插入HTMLJohn%看起来不像html：对不起，我忘了最后一部分。我要把它修好。固定的

Vue.filter('wrapText', function (text) {
  let a = text.split('%');
  let str = '';
  for (let x = 0; x < a.length; x++) {
    str += a[x];
    if (x % 2 == 0) {
        if (x < a.length - 1)
        str += '<b>';
    }
    else {
        str += '</b>';
    }
  }
  return str
});