Question

我想知道这是不是可以完成，但我需要一些建议。我有一个Vue JS组件如下

  <media class="u-media-top u-padding Media--secondary t-borderleft-{{FetchCompanyName()}} t-borderbottom" title="School Name">
    {{organisation}}
  </media>

在我有

的组件内部

<template><div class="Media" v-bind:class="class">....

因此，您可以看到我将一个类列表传递给组件，并在组件中将它们全部绑定到HTML。一切都很好。但是我想要我的变量（这是一个从mixin返回的字符串）

FetchCompanyName()

在传递给我的组件后进行评估（我希望看到t-borderleft-companyA）。当它加载时我现在看到了

 t-borderleft-{{FetchCompanyName()}}

因为我假设它只是作为一个字符串传递它。任何人都可以就如何实现我的目标向我提出建议吗？

干杯萨姆

Answer 1

你可以试试这个：

<media :class="'t-borderleft-' + FetchCompanyName()" class="u-media-top u-padding Media--secondary t-borderbottom" title="School Name">
    {{organisation}}
</media>

您还应该删除组件中的v-bind:class="class"。

您还可以尝试将FetchCompanyName设为计算属性

vue js在传递给组件时评估变量

1 个答案: