mirror of https://github.com/ElemeFE/element
Docs: Fix the tableData(2,3,4,5,6) to tableData (#14587)
likwotsing
Zhi Cun
parent
ad5ba879b0
commit
848e69d472
|
|
@ -177,7 +177,7 @@ You can highlight your table content to distinguish between "success, informatio
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData2"
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
:row-class-name="tableRowClassName">
|
||||
<el-table-column
|
||||
|
|
@ -221,7 +221,7 @@ You can highlight your table content to distinguish between "success, informatio
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
tableData2: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
address: 'No. 189, Grove St, Los Angeles'
|
||||
|
|
@ -253,7 +253,7 @@ When there are too many rows, you can use a fixed header.
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
height="250"
|
||||
style="width: 100%">
|
||||
<el-table-column
|
||||
|
|
@ -277,7 +277,7 @@ When there are too many rows, you can use a fixed header.
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
address: 'No. 189, Grove St, Los Angeles'
|
||||
|
|
@ -423,7 +423,7 @@ When you have huge chunks of data to put in a table, you can fix the header and
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
height="250">
|
||||
<el-table-column
|
||||
|
|
@ -464,7 +464,7 @@ When you have huge chunks of data to put in a table, you can fix the header and
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
state: 'California',
|
||||
|
|
@ -529,7 +529,7 @@ When the the data is dynamically changed, you might want the table to have a max
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData4"
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
max-height="250">
|
||||
<el-table-column
|
||||
|
|
@ -569,7 +569,7 @@ When the the data is dynamically changed, you might want the table to have a max
|
|||
width="120">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
@click.native.prevent="deleteRow(scope.$index, tableData4)"
|
||||
@click.native.prevent="deleteRow(scope.$index, tableData)"
|
||||
type="text"
|
||||
size="small">
|
||||
Remove
|
||||
|
|
@ -588,7 +588,7 @@ When the the data is dynamically changed, you might want the table to have a max
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
tableData4: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
state: 'California',
|
||||
|
|
@ -653,7 +653,7 @@ When the data structure is complex, you can use group header to show the data hi
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
style="width: 100%">
|
||||
<el-table-column
|
||||
prop="date"
|
||||
|
|
@ -696,7 +696,7 @@ When the data structure is complex, you can use group header to show the data hi
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
state: 'California',
|
||||
|
|
@ -838,7 +838,7 @@ You can also select multiple rows.
|
|||
<template>
|
||||
<el-table
|
||||
ref="multipleTable"
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange">
|
||||
<el-table-column
|
||||
|
|
@ -862,7 +862,7 @@ You can also select multiple rows.
|
|||
</el-table-column>
|
||||
</el-table>
|
||||
<div style="margin-top: 20px">
|
||||
<el-button @click="toggleSelection([tableData3[1], tableData3[2]])">Toggle selection status of second and third rows</el-button>
|
||||
<el-button @click="toggleSelection([tableData[1], tableData[2]])">Toggle selection status of second and third rows</el-button>
|
||||
<el-button @click="toggleSelection()">Clear selection</el-button>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -871,7 +871,7 @@ You can also select multiple rows.
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
address: 'No. 189, Grove St, Los Angeles'
|
||||
|
|
@ -1248,7 +1248,7 @@ When the row content is too long and you do not want to display the horizontal s
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
style="width: 100%">
|
||||
<el-table-column type="expand">
|
||||
<template slot-scope="props">
|
||||
|
|
@ -1273,7 +1273,7 @@ When the row content is too long and you do not want to display the horizontal s
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
state: 'California',
|
||||
|
|
@ -1337,7 +1337,7 @@ For table of numbers, you can add an extra row at the table footer displaying ea
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData6"
|
||||
:data="tableData"
|
||||
border
|
||||
show-summary
|
||||
style="width: 100%">
|
||||
|
|
@ -1368,7 +1368,7 @@ For table of numbers, you can add an extra row at the table footer displaying ea
|
|||
</el-table>
|
||||
|
||||
<el-table
|
||||
:data="tableData6"
|
||||
:data="tableData"
|
||||
border
|
||||
height="200"
|
||||
:summary-method="getSummaries"
|
||||
|
|
@ -1402,7 +1402,7 @@ For table of numbers, you can add an extra row at the table footer displaying ea
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData6: [{
|
||||
tableData: [{
|
||||
id: '12987122',
|
||||
name: 'Tom',
|
||||
amount1: '234',
|
||||
|
|
@ -1476,7 +1476,7 @@ Configuring rowspan and colspan allows you to merge cells
|
|||
<template>
|
||||
<div>
|
||||
<el-table
|
||||
:data="tableData6"
|
||||
:data="tableData"
|
||||
:span-method="arraySpanMethod"
|
||||
border
|
||||
style="width: 100%">
|
||||
|
|
@ -1507,7 +1507,7 @@ Configuring rowspan and colspan allows you to merge cells
|
|||
</el-table>
|
||||
|
||||
<el-table
|
||||
:data="tableData6"
|
||||
:data="tableData"
|
||||
:span-method="objectSpanMethod"
|
||||
border
|
||||
style="width: 100%; margin-top: 20px">
|
||||
|
|
@ -1540,7 +1540,7 @@ Configuring rowspan and colspan allows you to merge cells
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData6: [{
|
||||
tableData: [{
|
||||
id: '12987122',
|
||||
name: 'Tom',
|
||||
amount1: '234',
|
||||
|
|
|
|||
|
|
@ -177,7 +177,7 @@ Puede destacar el contenido de la tabla para distinguir entre "success, informat
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData2"
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
:row-class-name="tableRowClassName">
|
||||
<el-table-column
|
||||
|
|
@ -221,7 +221,7 @@ Puede destacar el contenido de la tabla para distinguir entre "success, informat
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
tableData2: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
address: 'No. 189, Grove St, Los Angeles'
|
||||
|
|
@ -253,7 +253,7 @@ Cuando esta tiene demasiadas filas, puede utilizar una cabecera fija.
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
height="250"
|
||||
style="width: 100%">
|
||||
<el-table-column
|
||||
|
|
@ -277,7 +277,7 @@ Cuando esta tiene demasiadas filas, puede utilizar una cabecera fija.
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
address: 'No. 189, Grove St, Los Angeles'
|
||||
|
|
@ -423,7 +423,7 @@ Cuando tienes grandes cantidades de datos para colocar en una tabla, puede fijar
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
height="250">
|
||||
<el-table-column
|
||||
|
|
@ -464,7 +464,7 @@ Cuando tienes grandes cantidades de datos para colocar en una tabla, puede fijar
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
state: 'California',
|
||||
|
|
@ -529,7 +529,7 @@ Cuando los datos se modifican dinámicamente, es posible que necesite que la tab
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData4"
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
max-height="250">
|
||||
<el-table-column
|
||||
|
|
@ -569,7 +569,7 @@ Cuando los datos se modifican dinámicamente, es posible que necesite que la tab
|
|||
width="120">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
@click.native.prevent="deleteRow(scope.$index, tableData4)"
|
||||
@click.native.prevent="deleteRow(scope.$index, tableData)"
|
||||
type="text"
|
||||
size="small">
|
||||
Eliminar
|
||||
|
|
@ -588,7 +588,7 @@ Cuando los datos se modifican dinámicamente, es posible que necesite que la tab
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
tableData4: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
state: 'California',
|
||||
|
|
@ -653,7 +653,7 @@ Cuando la estructura de datos es compleja, tu puedes hacer uso de cabeceras agru
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
style="width: 100%">
|
||||
<el-table-column
|
||||
prop="date"
|
||||
|
|
@ -696,7 +696,7 @@ Cuando la estructura de datos es compleja, tu puedes hacer uso de cabeceras agru
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
state: 'California',
|
||||
|
|
@ -838,7 +838,7 @@ También puede seleccionar múltiples filas.
|
|||
<template>
|
||||
<el-table
|
||||
ref="multipleTable"
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange">
|
||||
<el-table-column
|
||||
|
|
@ -862,7 +862,7 @@ También puede seleccionar múltiples filas.
|
|||
</el-table-column>
|
||||
</el-table>
|
||||
<div style="margin-top: 20px">
|
||||
<el-button @click="toggleSelection([tableData3[1], tableData3[2]])">Cambia el estado de selección de la segunda y tercera fila.</el-button>
|
||||
<el-button @click="toggleSelection([tableData[1], tableData[2]])">Cambia el estado de selección de la segunda y tercera fila.</el-button>
|
||||
<el-button @click="toggleSelection()">Limpiar selección</el-button>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -871,7 +871,7 @@ También puede seleccionar múltiples filas.
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
address: 'No. 189, Grove St, Los Angeles'
|
||||
|
|
@ -1250,7 +1250,7 @@ Cuando el contenido de la fila es demasiado largo y busca no mostrar la barra de
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
style="width: 100%">
|
||||
<el-table-column type="expand">
|
||||
<template slot-scope="props">
|
||||
|
|
@ -1275,7 +1275,7 @@ Cuando el contenido de la fila es demasiado largo y busca no mostrar la barra de
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
state: 'California',
|
||||
|
|
@ -1340,7 +1340,7 @@ Para una tabla de números, puede agregar una fila extra en el pie de página de
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData6"
|
||||
:data="tableData"
|
||||
border
|
||||
show-summary
|
||||
style="width: 100%">
|
||||
|
|
@ -1371,7 +1371,7 @@ Para una tabla de números, puede agregar una fila extra en el pie de página de
|
|||
</el-table>
|
||||
|
||||
<el-table
|
||||
:data="tableData6"
|
||||
:data="tableData"
|
||||
border
|
||||
height="200"
|
||||
:summary-method="getSummaries"
|
||||
|
|
@ -1405,7 +1405,7 @@ Para una tabla de números, puede agregar una fila extra en el pie de página de
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData6: [{
|
||||
tableData: [{
|
||||
id: '12987122',
|
||||
name: 'Tom',
|
||||
amount1: '234',
|
||||
|
|
@ -1480,7 +1480,7 @@ Configurar _rowspan_ y _colspan_ le permite fusionar celdas.
|
|||
<template>
|
||||
<div>
|
||||
<el-table
|
||||
:data="tableData6"
|
||||
:data="tableData"
|
||||
:span-method="arraySpanMethod"
|
||||
border
|
||||
style="width: 100%">
|
||||
|
|
@ -1511,7 +1511,7 @@ Configurar _rowspan_ y _colspan_ le permite fusionar celdas.
|
|||
</el-table>
|
||||
|
||||
<el-table
|
||||
:data="tableData6"
|
||||
:data="tableData"
|
||||
:span-method="objectSpanMethod"
|
||||
border
|
||||
style="width: 100%; margin-top: 20px">
|
||||
|
|
@ -1544,7 +1544,7 @@ Configurar _rowspan_ y _colspan_ le permite fusionar celdas.
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData6: [{
|
||||
tableData: [{
|
||||
id: '12987122',
|
||||
name: 'Tom',
|
||||
amount1: '234',
|
||||
|
|
|
|||
|
|
@ -177,7 +177,7 @@ Vous pouvez mettre en valeur certaines lignes du tableau suivant leur état, com
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData2"
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
:row-class-name="tableRowClassName">
|
||||
<el-table-column
|
||||
|
|
@ -221,7 +221,7 @@ Vous pouvez mettre en valeur certaines lignes du tableau suivant leur état, com
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
tableData2: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
address: 'No. 189, Grove St, Los Angeles'
|
||||
|
|
@ -253,7 +253,7 @@ Lorsqu'il y a beaucoup de lignes, il peut être utile d'avoir un header fixe afi
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
height="250"
|
||||
style="width: 100%">
|
||||
<el-table-column
|
||||
|
|
@ -277,7 +277,7 @@ Lorsqu'il y a beaucoup de lignes, il peut être utile d'avoir un header fixe afi
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
address: 'No. 189, Grove St, Los Angeles'
|
||||
|
|
@ -423,7 +423,7 @@ Si vous avez un gros volume de données à afficher, vous pouvez fixer le header
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
height="250">
|
||||
<el-table-column
|
||||
|
|
@ -464,7 +464,7 @@ Si vous avez un gros volume de données à afficher, vous pouvez fixer le header
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
state: 'California',
|
||||
|
|
@ -529,7 +529,7 @@ Quand les données changent dynamiquement, vous pouvez avoir besoin d'une hauteu
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData4"
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
max-height="250">
|
||||
<el-table-column
|
||||
|
|
@ -569,7 +569,7 @@ Quand les données changent dynamiquement, vous pouvez avoir besoin d'une hauteu
|
|||
width="120">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
@click.native.prevent="deleteRow(scope.$index, tableData4)"
|
||||
@click.native.prevent="deleteRow(scope.$index, tableData)"
|
||||
type="text"
|
||||
size="small">
|
||||
Supprimer
|
||||
|
|
@ -588,7 +588,7 @@ Quand les données changent dynamiquement, vous pouvez avoir besoin d'une hauteu
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
tableData4: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
state: 'California',
|
||||
|
|
@ -653,7 +653,7 @@ Quand la structure du tableau est complexe, vous pouvez grouper les headers afin
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
style="width: 100%">
|
||||
<el-table-column
|
||||
prop="date"
|
||||
|
|
@ -696,7 +696,7 @@ Quand la structure du tableau est complexe, vous pouvez grouper les headers afin
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
state: 'California',
|
||||
|
|
@ -838,7 +838,7 @@ Vous pouvez aussi sélectionner plusieurs lignes.
|
|||
<template>
|
||||
<el-table
|
||||
ref="multipleTable"
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange">
|
||||
<el-table-column
|
||||
|
|
@ -862,7 +862,7 @@ Vous pouvez aussi sélectionner plusieurs lignes.
|
|||
</el-table-column>
|
||||
</el-table>
|
||||
<div style="margin-top: 20px">
|
||||
<el-button @click="toggleSelection([tableData3[1], tableData3[2]])">Sélectionner les deuxième et troisième lignes</el-button>
|
||||
<el-button @click="toggleSelection([tableData[1], tableData[2]])">Sélectionner les deuxième et troisième lignes</el-button>
|
||||
<el-button @click="toggleSelection()">Effacer la sélection</el-button>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -871,7 +871,7 @@ Vous pouvez aussi sélectionner plusieurs lignes.
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
address: 'No. 189, Grove St, Los Angeles'
|
||||
|
|
@ -1251,7 +1251,7 @@ Lorsque le contenu d'une ligne est trop long et que vous ne souhaitez pas affich
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
style="width: 100%">
|
||||
<el-table-column type="expand">
|
||||
<template slot-scope="props">
|
||||
|
|
@ -1276,7 +1276,7 @@ Lorsque le contenu d'une ligne est trop long et que vous ne souhaitez pas affich
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: 'Tom',
|
||||
state: 'California',
|
||||
|
|
@ -1341,7 +1341,7 @@ Pour les tableaux de nombres, vous pouvez ajouter une ligne en plus pour affiche
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData6"
|
||||
:data="tableData"
|
||||
border
|
||||
show-summary
|
||||
style="width: 100%">
|
||||
|
|
@ -1372,7 +1372,7 @@ Pour les tableaux de nombres, vous pouvez ajouter une ligne en plus pour affiche
|
|||
</el-table>
|
||||
|
||||
<el-table
|
||||
:data="tableData6"
|
||||
:data="tableData"
|
||||
border
|
||||
height="200"
|
||||
:summary-method="getSummaries"
|
||||
|
|
@ -1406,7 +1406,7 @@ Pour les tableaux de nombres, vous pouvez ajouter une ligne en plus pour affiche
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData6: [{
|
||||
tableData: [{
|
||||
id: '12987122',
|
||||
name: 'Tom',
|
||||
amount1: '234',
|
||||
|
|
@ -1481,7 +1481,7 @@ Vous pouvez configurer l'étendue des lignes et colonnes afin de fusionner des c
|
|||
<template>
|
||||
<div>
|
||||
<el-table
|
||||
:data="tableData6"
|
||||
:data="tableData"
|
||||
:span-method="arraySpanMethod"
|
||||
border
|
||||
style="width: 100%">
|
||||
|
|
@ -1512,7 +1512,7 @@ Vous pouvez configurer l'étendue des lignes et colonnes afin de fusionner des c
|
|||
</el-table>
|
||||
|
||||
<el-table
|
||||
:data="tableData6"
|
||||
:data="tableData"
|
||||
:span-method="objectSpanMethod"
|
||||
border
|
||||
style="width: 100%; margin-top: 20px">
|
||||
|
|
@ -1545,7 +1545,7 @@ Vous pouvez configurer l'étendue des lignes et colonnes afin de fusionner des c
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData6: [{
|
||||
tableData: [{
|
||||
id: '12987122',
|
||||
name: 'Tom',
|
||||
amount1: '234',
|
||||
|
|
|
|||
|
|
@ -175,7 +175,7 @@
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData2"
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
:row-class-name="tableRowClassName">
|
||||
<el-table-column
|
||||
|
|
@ -219,7 +219,7 @@
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
tableData2: [{
|
||||
tableData: [{
|
||||
date: '2016-05-02',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1518 弄',
|
||||
|
|
@ -251,7 +251,7 @@
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
height="250"
|
||||
border
|
||||
style="width: 100%">
|
||||
|
|
@ -276,7 +276,7 @@
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1518 弄'
|
||||
|
|
@ -420,7 +420,7 @@
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
height="250">
|
||||
<el-table-column
|
||||
|
|
@ -461,7 +461,7 @@
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: '王小虎',
|
||||
province: '上海',
|
||||
|
|
@ -526,7 +526,7 @@
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData4"
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
max-height="250">
|
||||
<el-table-column
|
||||
|
|
@ -566,7 +566,7 @@
|
|||
width="120">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
@click.native.prevent="deleteRow(scope.$index, tableData4)"
|
||||
@click.native.prevent="deleteRow(scope.$index, tableData)"
|
||||
type="text"
|
||||
size="small">
|
||||
移除
|
||||
|
|
@ -585,7 +585,7 @@
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
tableData4: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: '王小虎',
|
||||
province: '上海',
|
||||
|
|
@ -650,7 +650,7 @@
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
style="width: 100%">
|
||||
<el-table-column
|
||||
prop="date"
|
||||
|
|
@ -693,7 +693,7 @@
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: '王小虎',
|
||||
province: '上海',
|
||||
|
|
@ -835,7 +835,7 @@
|
|||
<template>
|
||||
<el-table
|
||||
ref="multipleTable"
|
||||
:data="tableData3"
|
||||
:data="tableData"
|
||||
tooltip-effect="dark"
|
||||
style="width: 100%"
|
||||
@selection-change="handleSelectionChange">
|
||||
|
|
@ -860,7 +860,7 @@
|
|||
</el-table-column>
|
||||
</el-table>
|
||||
<div style="margin-top: 20px">
|
||||
<el-button @click="toggleSelection([tableData3[1], tableData3[2]])">切换第二、第三行的选中状态</el-button>
|
||||
<el-button @click="toggleSelection([tableData[1], tableData[2]])">切换第二、第三行的选中状态</el-button>
|
||||
<el-button @click="toggleSelection()">取消选择</el-button>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -869,7 +869,7 @@
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData3: [{
|
||||
tableData: [{
|
||||
date: '2016-05-03',
|
||||
name: '王小虎',
|
||||
address: '上海市普陀区金沙江路 1518 弄'
|
||||
|
|
@ -1172,7 +1172,7 @@
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData5"
|
||||
:data="tableData"
|
||||
style="width: 100%">
|
||||
<el-table-column type="expand">
|
||||
<template slot-scope="props">
|
||||
|
|
@ -1235,7 +1235,7 @@
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData5: [{
|
||||
tableData: [{
|
||||
id: '12987122',
|
||||
name: '好滋好味鸡蛋仔',
|
||||
category: '江浙小吃、小吃零食',
|
||||
|
|
@ -1358,7 +1358,7 @@
|
|||
```html
|
||||
<template>
|
||||
<el-table
|
||||
:data="tableData6"
|
||||
:data="tableData"
|
||||
border
|
||||
show-summary
|
||||
style="width: 100%">
|
||||
|
|
@ -1389,7 +1389,7 @@
|
|||
</el-table>
|
||||
|
||||
<el-table
|
||||
:data="tableData6"
|
||||
:data="tableData"
|
||||
border
|
||||
height="200"
|
||||
:summary-method="getSummaries"
|
||||
|
|
@ -1423,7 +1423,7 @@
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData6: [{
|
||||
tableData: [{
|
||||
id: '12987122',
|
||||
name: '王小虎',
|
||||
amount1: '234',
|
||||
|
|
@ -1498,7 +1498,7 @@
|
|||
<template>
|
||||
<div>
|
||||
<el-table
|
||||
:data="tableData6"
|
||||
:data="tableData"
|
||||
:span-method="arraySpanMethod"
|
||||
border
|
||||
style="width: 100%">
|
||||
|
|
@ -1529,7 +1529,7 @@
|
|||
</el-table>
|
||||
|
||||
<el-table
|
||||
:data="tableData6"
|
||||
:data="tableData"
|
||||
:span-method="objectSpanMethod"
|
||||
border
|
||||
style="width: 100%; margin-top: 20px">
|
||||
|
|
@ -1562,7 +1562,7 @@
|
|||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData6: [{
|
||||
tableData: [{
|
||||
id: '12987122',
|
||||
name: '王小虎',
|
||||
amount1: '234',
|
||||
|
|
|
|||
Loading…
Reference in New Issue