javascript - 从 DB 获取返回 [object Object] 而不是 Vue JS 中的值

Question

我正在使用带有下拉选项的 Vuetify 创建一个表单，但是我想从我的数据库中的表中获取下拉选项，而不是对选项进行硬编码。

它似乎正在工作，这意味着数据库表中的每个新条目都会增加我在下拉列表中的选项数。但是，它显示的只是 [object Object]。我怎样才能真正让它显示实际值？

模板标签内的下拉组件：

<v-card>
    <v-container>
        <v-col class="d-flex" cols="12">
            <v-select
            :items="allDropdownTypes"
            label="Project Type"
            >
            </v-select>
        </v-col>
    </v-container> 
</v-card>

道具：

    props: {
        allDropdownTypes: Array
    },

我的刀片模板：

<div>
    <project-form-v2 
    :all-dropdown-types="{{ $allDropdownTypes }}"
    >
    </project-form>
</div>

标签： javascriptvue.jsvuetify.js

Answer 1

这修复了它：

                <v-card>
                    <v-container>
                        <v-select
                        :items="allDropdownTypes.map(a => a.value)"
                        label="Project Type"
                        >
                        </v-select>
                    </v-container>
                </v-card>