我正在尝试解决一个问题。
我有一个基本上是HTML代码的字符串：
let htmlTitle = "<a href="/news/sky-sport-hd-in-italia-dal-18-novembr">Sky Sport HD in italia dal 18 novembre</a> | <a href="/news/ecco-il-genio-spagnolo-designer-di-moto-elettriche">News</a> | <a href="/news/lg-electronic-e-here-insieme-per-l-auto-connessa-e-autonoma">News</a>"
字符串来自我的数据库。
我在我的 vue 应用程序中有一个"slug"输入字段，在 slug 中我有：
"sky-sport-hd-in-italia-dal-18-novembr"
这是字符串引用的第一个内容的永久链接。
当我更改输入字段时，我需要标题字符串适应我的更改，但我无法理解如何做到这一点。
在我的标题字符串中，我可以有无限数量的锚标签，但我只需要更改与 slug 匹配的href值。
我需要这样的东西：
"<a href="{{ slug }}">Sky Sport HD in italia dal 18 novembre</a> | <a href="/news/ecco-il-genio-spagnolo-designer-di-moto-elettriche">News</a> | <a href="/news/lg-electronic-e-here-insieme-per-l-auto-connessa-e-autonoma">News</a>"
我可以使用计算值，但我的字符串可以使用所见即所得编辑器进行编辑，我可以在其中更改标题("11 月 18 日意大利天空体育高清"或"新闻"(。我只需要保持鼻涕虫对齐...
使用观察者和 v-html。当您更改 slug 时 - 只需使用链接更新变量 这是一个例子
watch: {
slug: function(val) {
this.href = this.result;
}
}
https://jsfiddle.net/1b68eLdr/52554/
我会说你需要使用计算值(doc(。
字符串 htmlTitle 将是一个计算值
computed: {
// ES6
htmlTitle () {
return `<a href="${this.slug}">Sky Sport HD in italia dal 18 novembre</a> | <a href="/news/ecco-il-genio-spagnolo-designer-di-moto-elettriche">News</a> | <a href="/news/lg-electronic-e-here-insieme-per-l-auto-connessa-e-autonoma">News</a>`
}
// ES5
htmlTitle: funciton() {
return "<a href='" + this.slug + "'>Sky Sport HD in italia dal 18 novembre</a> | <a href="/news/ecco-il-genio-spagnolo-designer-di-moto-elettriche">News</a> | <a href="/news/lg-electronic-e-here-insieme-per-l-auto-connessa-e-autonoma">News</a>"
}
}