動態將值綁定到組件的道具

Question

我用道具定義了自定義組件。 當我使用此組件時，我需要將值動態綁定到這些道具的一個上

在自定義組件的模板中，我定義了如下元素：

<template>
...
    <div class="input-group-addon" v-show="currency">{{ currency }}</div>
...
</template>

及其道具：

export default {
   ...
    props: {
      currency: {
        type: String
      }
    }
   ...
}

組件在另一個組件中的用法：

組件的模板

<custom-component currency="calculateCurrency" ></custom-component>

組件的代碼

export default {
   components: {custom-component},
   data: () => ({
      myProject: null // this is used as v-model in combo box
   }),
   computed: {
      calculateCurrency: function() {
          return myProject.currency; // currency is getter in object myProject
      }
   }
}

所以結果我有這樣的事情：

我也嘗試使用

suffix=calculateCurrency

沒有引號，但沒有幫助。 你能幫我解決嗎？ 謝謝

Answer 1

我相信您在綁定屬性上缺少冒號：

<custom-component :currency="calculateCurrency" ></custom-component>

在“ currency”之前添加它可以進行數據綁定