时间戳

首页 > 解决方案 > 如何在 b-form-input 中显示默认值？在 Vue 中

javascript - 如何在 b-form-input 中显示默认值？在 Vue 中

问题描述

嗨，我需要设置输入的默认值。怎么做？

我试图输入：value="amount" 但它不起作用。当我只使用没有输入的文本时，看起来我看不到可变数量。

<template>
    <div>
        <slot name="mass-buttons"></slot>
        <b-table
                striped hover :busy="isBusy" :fields="fields" :items="items" :show-empty="true"
                :empty-text="'Nebyly nalezeny žádné záznamy'"
        >

            <template slot="unit_price">
                <div class="form-group">
                    <b-form-input type="text" class="form-control w-100" size="sm" >
                    </b-form-input>
                </div>
            </template>

        </b-table>
    </div>
</template>

<script>
    export default {
        name: "CustomItemGrid",
        props: {
            isBusy: {
                type: Boolean,
                required: true
            },
            fields: {
                type: Array,
                required: true
            },
            items: {
                type: Array,
                required: true
            },
            test: "Hello"
        }
    }
</script>

我从另一个组件发送到组件：

  gridItemsFields: [
                    {key: 'name', label: 'Název'},
                    {key: 'unit_price', label: 'Cena za jednotku bez DPH'},
                    {key: 'amount', label: 'Množství',formatter:'test'},
                    {key: 'total_price', label: 'Cena celkem bez DPH'},
                    {key: 'actions', label: ''}
                ],

它看起来如何

编辑：我在模板中添加了属性 slot-scope=data，现在我可以通过 data.amount 查看数量，但仍然不能通过 :value 或 v-model 将其用作默认值。

标签： javascriptvue.js

解决方案

这解决了我的问题：

<template slot="amount" slot-scope="data">
    <div class="form-group">
        <b-form-input type="text" class="form-control w-100" size="sm" v-model="data.item.amount">
        </b-form-input>
     </div>
</template>

推荐阅读