编辑1

Question

以下显示的代码用 vue.js 编写。

是否有可能创建 mailto -link？
Vue不喜欢:中的双冒号mailto:item.url。

Vue.component('my-component', {
  props: ['item'],
  template: `
    <div class="foo">
      <a v-bind:href="mailto:item.url">
        {{ item.url }}
      </a>
    </div>
  `
});

Answer 1

我自己发现以下代码有效：

import com.facebook.react.bridge.JavaScriptModule;

@override public List<Class<? extends JavaScriptModule>> createJSModules() { return Collections.emptyList(); }

Answer 2

Vuejs没有逃过双结肠。你在#!/usr/bin/python3.8里面写的不是字符串，而是javascript代码。

v-bind:href="..."不是有效的JavaScript代码。所以你必须使用语言工具构建一个字符串。

构建该字符串的另一种解决方案：

使用ES6 Template Literals - 更清晰的语法。
您无需明确声明mailto:item.url。您可以使用简写v-bind:href。这更标准，更具可读性。

见代码：

:href

编辑1

您已将整个<a :href="`mailto:${item.url}`">置于template内。 It is possible to nest template literal inside another template literal expression。

天气你认为使用模板文字将有助于你的代码的可读性，这取决于个人品味。

当您使用简单的模板形式时，也许这个案例更具争议性。使用配置了webpack boilerplate的vue-loader时，它更具可读性。

Vue.js逃脱双冒号

2 个答案:

编辑1