Javascript 原型返回的是我的函数，而不是返回值

我想创建类似于图像的页面字幕

我想通过调用main.js中的原型来实现这一点

Vue.prototype.subtitlePage = function () {
  var path = this.$route.path;
  var array_path = path.split('/');
  var subtitle = "<ul class='subtitle'>";
  var index;
  for (index = 1; index < array_path.length - 2; index++) {
    subtitle += "<li>" + array_path[index] + "</li> >>";
  }
  subtitle += "<li>" + array_path[index] + "</li><ul>";
  return subtitle;
}

Vue.prototype.subtitlePage=函数（）{
var path=此。$route.path；
var数组_path=path.split（'/'）；
var subtitle=“
”；
var指数；
对于（索引=1；索引”+数组路径[索引]+“>”；
}
副标题+=“
”+数组路径[索引]+“
”；
返回字幕；
}

在构建屏幕时，我就是这样调用我的函数的

<p class="indextitle">Subir Nova Redação</p>
<p v-html="subtitlePage"></p>

新雷达多酒店

但是，屏幕上显示的文本不是函数中装载的html返回，而是my函数的代码

function () { var path = this.$route.path; var array_path = path.split('/'); var subtitle = "
"; var index; for (index = 1; index < array_path.length - 2; index++) { subtitle += "
" + array_path[index] + "
>>"; } subtitle += "
" + array_path[index] + "
"; return subtitle; }

function（）{var path=this.$route.path；var数组_path=path.split（'/'）；var subtitle=”
“var index；for（index=1；index>“；}副标题+=”
“+数组_路径[索引]+”
“返回字幕；}

---

有人知道我做错了什么，以及我必须在代码中修改什么才能出现在副标题“我在函数中设置了什么”中吗？

我成功地做到了以下几点

Vue.mixin({
  computed: {
    subtitlePage: {
      get: function () {
        var path = this.$route.path;
        var array_path = path.split('/');
        var subtitle = "<ul class='subtitle'>";
        var index;
        for (index = 1; index < array_path.length - 2; index++) {
          subtitle += "<li>" + array_path[index] + "</li> >>";
        }
        subtitle += "<li>" + array_path[index] + "</li><ul>";
        return subtitle; 
      }
    }
  }
})

Vue.mixin({
计算：{
副标题页：{
get:function（）{
var path=此。$route.path；
var数组_path=path.split（'/'）；
var subtitle=“
”；
var指数；
对于（索引=1；索引”+数组路径[索引]+“>”；
}
副标题+=“
”+数组路径[索引]+“
”；
返回字幕；
}
}
}
})

，当给定函数时，这将导致字符串化函数输出。应该是：

<p v-html="subtitlePage()"></p>

在实际操作中，不应使用用户定义的数据执行此操作。

在您的网站上动态呈现任意HTML可能非常危险，因为它很容易导致XSS攻击。仅在受信任的内容上使用v-html，而不在用户提供的内容上使用v-html

URL是此处的用户定义数据。罪犯可以定制它来评估用户端的任意JS

正确的方法是为面包屑创建一个组件，并使用以下命令将其输出：

<li v-for="pathSegment in pathSegments">{{pathSegment}}</li>

{{pathSegment}

---

如果一个段可能包含URL编码的符号（本例中为空格和非ASCII字符），则需要使用

decodeURIComponent

对段进行额外转换（原始代码中未涉及这一点，这将是

v-html

的主要危害）。

根据文档，这是正确的行为。。。。它输出html，在你的例子中，它是一个完整的函数。。如果你在网上翻找，你会发现一两个有效的例子。返回函数文本的不是原型，而是

subtitlePage

的使用方式-任何不使用

（）

的函数都可以作为字符串访问（使用

functionName.toString（）

或已被强制，即

''+functionName

）将导致函数体像那样返回-可能

v-html

不希望函数名作为参数？路由路径元素听起来像是攻击者可能控制的类型；例如，通过让用户单击一个链接，他们在该链接中创建了URL路径。此代码在附加到

subtitle

之前，可能需要对

array\u path[index]

进行HTML转义或清理，以避免XSS。