Skip to content

Commit eea0142

Browse files
author
Pooya Parsa
committed
docs(table): update scope to slot-scope in examples
1 parent d6868b3 commit eea0142

File tree

1 file changed

+15
-15
lines changed

1 file changed

+15
-15
lines changed

src/components/table/README.md

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -573,15 +573,15 @@ slot(s).
573573
<template>
574574
<b-table :fields="fields" :items="items">
575575
<!-- A virtual column -->
576-
<template slot="index" scope="data">
576+
<template slot="index" slot-scope="data">
577577
{{data.index + 1}}
578578
</template>
579579
<!-- A custom formatted column -->
580-
<template slot="name" scope="data">
580+
<template slot="name" slot-scope="data">
581581
{{data.value.first}} {{data.value.last}}
582582
</template>
583583
<!-- A virtual composite column -->
584-
<template slot="nameage" scope="data">
584+
<template slot="nameage" slot-scope="data">
585585
{{data.item.name.first}} is {{data.item.age}} years old
586586
</template>
587587
</b-table>
@@ -640,7 +640,7 @@ be empty) to prevent the click on the input, button, select, or link, from trigg
640640
the `row-clicked` event:_
641641

642642
```html
643-
<template slot="actions" scope="cell">
643+
<template slot="actions" slot-scope="cell">
644644
<!-- We use click.stop here to prevent a 'row-clicked' event from also happening -->
645645
<b-btn size="sm" @click.stop="details(cell.item,cell.index,$event.target)">Details</b-btn>
646646
</template>
@@ -661,7 +661,7 @@ return the formatted value as a string (basic HTML is supported)
661661
```html
662662
<template>
663663
<b-table :fields="fields" :items="items">
664-
<template slot="name" scope="data">
664+
<template slot="name" slot-scope="data">
665665
<a :href="`#${data.value.replace(/[^a-z]+/i,'-').toLowerCase()}`">
666666
{{data.value}}
667667
</a>
@@ -729,15 +729,15 @@ the footer will use the `HEAD_` slot content.
729729

730730
```html
731731
<b-table :fields="fields" :items="items" foot-clone>
732-
<template slot="name" scope="data">
732+
<template slot="name" slot-scope="data">
733733
<!-- A custom formatted data column cell -->
734734
{{data.value.first}} {{data.value.last}}
735735
</template>
736-
<template slot="HEAD_name" scope="data">
736+
<template slot="HEAD_name" slot-scope="data">
737737
<!-- A custom formatted header cell for field 'name' -->
738738
<em>{{data.label}}</em>
739739
</template>
740-
<template slot="FOOT_name" scope="data">
740+
<template slot="FOOT_name" slot-scope="data">
741741
<!-- A custom formatted footer cell for field 'name' -->
742742
<strong>{{data.label}}</strong>
743743
</template>
@@ -758,7 +758,7 @@ click on the input, button, select, or link, from triggering a change in sorting
758758
or a `head-clicked` event.
759759

760760
```html
761-
<template slot="HEAD_actions" scope="foo">
761+
<template slot="HEAD_actions" slot-scope="foo">
762762
<!-- We use click.stop here to prevent 'sort-changed' or 'head-clicked' events -->
763763
<input @click.stop type="checkbox" :value="foo.column" v-model="selected">
764764
<!-- We use click.native.stop here to prevent 'sort-changed' or 'head-clicked' events -->
@@ -802,7 +802,7 @@ to have details initially showing.
802802
```html
803803
<template>
804804
<b-table :items="items" :fields="fields">
805-
<template slot="show_details" scope="row">
805+
<template slot="show_details" slot-scope="row">
806806
<!-- we use @click.stop here to prevent emitting of a 'row-clicked' event -->
807807
<b-button size="sm" @click.stop="row.toggleDetails" class="mr-2">
808808
{{ row.detailsShowing ? 'Hide' : 'Show'}} Details
@@ -813,7 +813,7 @@ to have details initially showing.
813813
Details via check
814814
</b-form-checkbox>
815815
</template>
816-
<template slot="row-details" scope="row">
816+
<template slot="row-details" slot-scope="row">
817817
<b-card>
818818
<b-row class="mb-2">
819819
<b-col sm="3" class="text-sm-right"><b>Age:</b></b-col>
@@ -1256,9 +1256,9 @@ when fetching your data!
12561256
:sort-desc.sync="sortDesc"
12571257
@filtered="onFiltered"
12581258
>
1259-
<template slot="name" scope="row">{{row.value.first}} {{row.value.last}}</template>
1260-
<template slot="isActive" scope="row">{{row.value?'Yes :)':'No :('}}</template>
1261-
<template slot="actions" scope="row">
1259+
<template slot="name" slot-scope="row">{{row.value.first}} {{row.value.last}}</template>
1260+
<template slot="isActive" slot-scope="row">{{row.value?'Yes :)':'No :('}}</template>
1261+
<template slot="actions" slot-scope="row">
12621262
<!-- We use @click.stop here to prevent a 'row-clicked' event from also happening -->
12631263
<b-button size="sm" @click.stop="info(row.item, row.index, $event.target)" class="mr-1">
12641264
Info modal
@@ -1267,7 +1267,7 @@ when fetching your data!
12671267
{{ row.detailsShowing ? 'Hide' : 'Show' }} Details
12681268
</b-button>
12691269
</template>
1270-
<template slot="row-details" scope="row">
1270+
<template slot="row-details" slot-scope="row">
12711271
<b-card>
12721272
<ul>
12731273
<li v-for="(value, key) in row.item" :key="key">{{ key }}: {{ value}}</li>

0 commit comments

Comments
 (0)