Question

我正在尝试创建一个Vue SelectComponent。我想传递给组件的其中一个属性是Select之类的名称：

<select-component selectName="providers"></select-component>

在我的组件中，我有：

<template>
    <select :name="{selectName}" >
        <option value="bla">{{selectName}}</option>
    </select>
</template>

<script>
  export default {
    props: ['selectName'],
    data() {
      return {

      }
    }
  }
</script>

<style scoped>

</style>

但是，当我查看我的chromeDev工具时，我看到它生成了：

<select data-v-674655fa="" data-v-70be8f72="" name="[object Object]"><option data-v-674655fa="" value="bla">providers</option></select>

注意：name="[object Object]" 预计是：name="providers"

我在Laravel项目中使用Vuejs。

非常感谢。

Answer 1

<template>
    <select :name="selectName" > //without the brackets
        <option value="bla">{{selectName}}</option>
    </select>
</template>

Vuejs - 将属性名称传递给子组件

1 个答案: