Несколько кнопок расширения в одном ряду - PullRequest
0 голосов
/ 04 июля 2019

Используя последнюю версию Vue, как получить 2 столбца в одной строке с кнопкой «Показать подробности», которые показывают совершенно отдельную и различную информацию?

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<b-table striped hover :items="loadSelected">
  <!-- Compartment Row -->
  <template slot="compartmentSummary" slot-scope="compartmentrow">
                        <b-button size="sm" @click="compartmentrow.toggleDetails" class="mr-2">
                        {{ row.detailsShowing ? 'Hide' : 'Show'}} Details
                        </b-button>
                     </template>
  <template slot="row-details" slot-scope="compartmentrow">
                         <b-table striped hover :items="compartmentrow.item.compartmentSummary">
                             <template slot="show_details" slot-scope="r">
                                 {{ r.compartmentNumber }}
                             </template>
</b-table>
</template>
<!-- Product Row -->
<template slot="productSummary" slot-scope="productrow">
                        <b-button size="sm" @click="productrow.toggleDetails" class="mr-2">
                        {{ productrow.detailsShowing ? 'Hide' : 'Show'}} Details
                        </b-button>
                    </template>
<template slot="productrow-details" slot-scope="productrow">
                        <b-table stripped hover :items="productrow.item.product">
                            <template slot="show_details" slot-scope="pr">
                                {{ pr.product}}
                            </template>
</b-table>
</template>
</b-table>
...