mirror of https://github.com/ElemeFE/element
add sponsor logo
Leopoldthecoder
杨奕
parent
dd58f8c145
commit
f08f435d43
|
|
@ -9,6 +9,7 @@ lib
|
||||||
examples/element-ui
|
examples/element-ui
|
||||||
examples/pages/en-US
|
examples/pages/en-US
|
||||||
examples/pages/zh-CN
|
examples/pages/zh-CN
|
||||||
|
examples/pages/es
|
||||||
fe.element/element-ui
|
fe.element/element-ui
|
||||||
.npmrc
|
.npmrc
|
||||||
coverage
|
coverage
|
||||||
|
|
|
||||||
12
README.md
12
README.md
|
|
@ -18,6 +18,18 @@
|
||||||
|
|
||||||
> A Vue.js 2.0 UI Toolkit for Web.
|
> A Vue.js 2.0 UI Toolkit for Web.
|
||||||
|
|
||||||
|
<p align="center">
|
||||||
|
<b>Special thanks to the generous sponsorship by:</b>
|
||||||
|
</p>
|
||||||
|
<p align="center">
|
||||||
|
<a href="https://tipe.io/?ref=element" target="_blank">Tipo.io</a>
|
||||||
|
</p>
|
||||||
|
<p align="center">
|
||||||
|
<a href="https://tipe.io/?ref=element" target="_blank">
|
||||||
|
<img style="vertical-align: middle" width="150px" src="https://user-images.githubusercontent.com/10095631/34094742-79218b1c-e409-11e7-8efc-65e14c0e15c3.png">
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
|
||||||
## Links
|
## Links
|
||||||
- Homepage and documentation
|
- Homepage and documentation
|
||||||
- International users: http://element.eleme.io/
|
- International users: http://element.eleme.io/
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,175 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 148.32 226.69">
|
||||||
|
<defs>
|
||||||
|
<style>
|
||||||
|
.cls-1 {
|
||||||
|
isolation: isolate;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-2 {
|
||||||
|
fill: url(#radial-gradient);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-3 {
|
||||||
|
fill: url(#linear-gradient);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-4 {
|
||||||
|
fill: url(#linear-gradient-2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-5 {
|
||||||
|
fill: url(#linear-gradient-3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-6 {
|
||||||
|
fill: url(#linear-gradient-4);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-7 {
|
||||||
|
fill: url(#linear-gradient-5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-8 {
|
||||||
|
fill: url(#linear-gradient-6);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-9 {
|
||||||
|
opacity: 0.7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-11, .cls-9 {
|
||||||
|
mix-blend-mode: multiply;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-10 {
|
||||||
|
fill: url(#linear-gradient-7);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-12 {
|
||||||
|
fill: url(#linear-gradient-8);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-13 {
|
||||||
|
fill: url(#linear-gradient-9);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-14 {
|
||||||
|
fill: #3c2e36;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-15 {
|
||||||
|
fill: url(#linear-gradient-10);
|
||||||
|
}
|
||||||
|
|
||||||
|
.cls-16 {
|
||||||
|
fill: url(#radial-gradient-2);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<radialGradient id="radial-gradient" cx="74.93" cy="117.87" r="86.39" gradientTransform="translate(0 22.72) scale(1 1.07)" gradientUnits="userSpaceOnUse">
|
||||||
|
<stop offset="0.32" stop-color="#e4dce1"/>
|
||||||
|
<stop offset="0.48" stop-color="#e1dadf"/>
|
||||||
|
<stop offset="0.59" stop-color="#d9d3da"/>
|
||||||
|
<stop offset="0.68" stop-color="#cac7d2"/>
|
||||||
|
<stop offset="0.76" stop-color="#b5b6c6"/>
|
||||||
|
<stop offset="0.79" stop-color="#aaadc0"/>
|
||||||
|
<stop offset="1" stop-color="#6f6f85"/>
|
||||||
|
</radialGradient>
|
||||||
|
<linearGradient id="linear-gradient" x1="38.85" y1="122.53" x2="108.18" y2="108.38" gradientUnits="userSpaceOnUse">
|
||||||
|
<stop offset="0" stop-color="#e4dce1"/>
|
||||||
|
<stop offset="0.19" stop-color="#d7d0d7"/>
|
||||||
|
<stop offset="0.53" stop-color="#b5b2be"/>
|
||||||
|
<stop offset="0.97" stop-color="#808296"/>
|
||||||
|
</linearGradient>
|
||||||
|
<linearGradient id="linear-gradient-2" x1="32.25" y1="64.7" x2="148.44" y2="64.7" gradientUnits="userSpaceOnUse">
|
||||||
|
<stop offset="0.32" stop-color="#e4dce1"/>
|
||||||
|
<stop offset="0.49" stop-color="#e1dadf"/>
|
||||||
|
<stop offset="0.6" stop-color="#d9d3da"/>
|
||||||
|
<stop offset="0.69" stop-color="#cac7d2"/>
|
||||||
|
<stop offset="0.78" stop-color="#b5b6c6"/>
|
||||||
|
<stop offset="0.81" stop-color="#aaadc0"/>
|
||||||
|
<stop offset="1" stop-color="#6f6f85"/>
|
||||||
|
</linearGradient>
|
||||||
|
<linearGradient id="linear-gradient-3" x1="139.11" y1="68.34" x2="139.11" y2="1.17" gradientUnits="userSpaceOnUse">
|
||||||
|
<stop offset="0.12" stop-color="#888aa0"/>
|
||||||
|
<stop offset="0.54" stop-color="#716f8a"/>
|
||||||
|
<stop offset="0.89" stop-color="#635d7c"/>
|
||||||
|
</linearGradient>
|
||||||
|
<linearGradient id="linear-gradient-4" x1="111.94" y1="16.05" x2="135.36" y2="16.05" gradientUnits="userSpaceOnUse">
|
||||||
|
<stop offset="0" stop-color="#3c314b"/>
|
||||||
|
<stop offset="0.54" stop-color="#534a67"/>
|
||||||
|
<stop offset="0.89" stop-color="#635d7c"/>
|
||||||
|
</linearGradient>
|
||||||
|
<linearGradient id="linear-gradient-5" x1="6752.04" y1="68.34" x2="6752.04" y2="-3.45" gradientTransform="matrix(-1, 0, 0, 1, 6787.68, 0)" gradientUnits="userSpaceOnUse">
|
||||||
|
<stop offset="0.19" stop-color="#e4dce1"/>
|
||||||
|
<stop offset="0.42" stop-color="#c2bac6"/>
|
||||||
|
<stop offset="0.92" stop-color="#6b6582"/>
|
||||||
|
<stop offset="0.97" stop-color="#635d7c"/>
|
||||||
|
</linearGradient>
|
||||||
|
<linearGradient id="linear-gradient-6" x1="39.39" y1="16.05" x2="62.82" y2="16.05" gradientUnits="userSpaceOnUse">
|
||||||
|
<stop offset="0" stop-color="#3c314b"/>
|
||||||
|
<stop offset="0.02" stop-color="#3d324c"/>
|
||||||
|
<stop offset="0.35" stop-color="#524a66"/>
|
||||||
|
<stop offset="0.65" stop-color="#5f5876"/>
|
||||||
|
<stop offset="0.89" stop-color="#635d7c"/>
|
||||||
|
</linearGradient>
|
||||||
|
<linearGradient id="linear-gradient-7" x1="79.66" y1="229.05" x2="79.66" y2="194.82" gradientUnits="userSpaceOnUse">
|
||||||
|
<stop offset="0.03" stop-color="#808296"/>
|
||||||
|
<stop offset="0.31" stop-color="#b7b8c3" stop-opacity="0.78"/>
|
||||||
|
<stop offset="0.79" stop-color="#fff" stop-opacity="0.5"/>
|
||||||
|
</linearGradient>
|
||||||
|
<linearGradient id="linear-gradient-8" x1="87.38" y1="117.84" x2="87.38" y2="41.77" gradientUnits="userSpaceOnUse">
|
||||||
|
<stop offset="0" stop-color="#e3dddf" stop-opacity="0"/>
|
||||||
|
<stop offset="0.04" stop-color="#cbc5cd" stop-opacity="0.12"/>
|
||||||
|
<stop offset="0.15" stop-color="#9d97a9" stop-opacity="0.37"/>
|
||||||
|
<stop offset="0.25" stop-color="#7b758f" stop-opacity="0.54"/>
|
||||||
|
<stop offset="0.35" stop-color="#67617f" stop-opacity="0.65"/>
|
||||||
|
<stop offset="0.45" stop-color="#605a7a" stop-opacity="0.68"/>
|
||||||
|
<stop offset="0.54" stop-color="#575070" stop-opacity="0.75"/>
|
||||||
|
<stop offset="1" stop-color="#382e4a"/>
|
||||||
|
</linearGradient>
|
||||||
|
<linearGradient id="linear-gradient-9" x1="11357.22" y1="78.8" x2="11361.46" y2="58.49" gradientTransform="matrix(-1, 0, 0, 1, 11419.34, 0)" gradientUnits="userSpaceOnUse">
|
||||||
|
<stop offset="0.07" stop-color="#28ffff"/>
|
||||||
|
<stop offset="0.41" stop-color="#51d2ff"/>
|
||||||
|
<stop offset="0.8" stop-color="#7ba3ff"/>
|
||||||
|
<stop offset="1" stop-color="#8b91ff"/>
|
||||||
|
</linearGradient>
|
||||||
|
<linearGradient id="linear-gradient-10" x1="113" y1="78.8" x2="117.24" y2="58.49" gradientTransform="matrix(1, 0, 0, 1, 0, 0)" xlink:href="#linear-gradient-9"/>
|
||||||
|
<radialGradient id="radial-gradient-2" cx="36.09" cy="124.71" r="36.13" gradientUnits="userSpaceOnUse">
|
||||||
|
<stop offset="0.11" stop-color="#635d7c"/>
|
||||||
|
<stop offset="0.35" stop-color="#5f5876"/>
|
||||||
|
<stop offset="0.65" stop-color="#524a66"/>
|
||||||
|
<stop offset="0.98" stop-color="#3d324c"/>
|
||||||
|
<stop offset="1" stop-color="#3c314b"/>
|
||||||
|
</radialGradient>
|
||||||
|
</defs>
|
||||||
|
<title>Asset 3</title>
|
||||||
|
<g class="cls-1">
|
||||||
|
<g id="Layer_2" data-name="Layer 2">
|
||||||
|
<g id="Layer_1-2" data-name="Layer 1">
|
||||||
|
<g>
|
||||||
|
<path class="cls-2" d="M138.13,128.27c-4.7-9.78-11.29-21.28-9.75-33.55a15.83,15.83,0,0,1,3.26-8.26A65.12,65.12,0,0,1,114.75,99a64.1,64.1,0,0,1-6.11,2.76,66.61,66.61,0,0,0-14.35,9.42c-13.43,11.7-26.21,44.39-48.51,50.6h0a23.9,23.9,0,0,1-9.81,2c-9.41-.07-20.4-6.21-26.26-15.43C1,134.68,3.58,115.85,9.49,103.81c-.18.37-.37.74-.55,1.13a102.51,102.51,0,0,0-4.2,10.42v0A86.37,86.37,0,0,0,0,143.69c0,45.84,35.49,83,79.27,83,11.19,0,29-3.38,43.66-13.61a57.75,57.75,0,0,0,22.57-32C151.54,158.58,144.94,142.45,138.13,128.27Z"/>
|
||||||
|
<path class="cls-3" d="M51.46,158.37a27,27,0,0,1-5.67,3.38h0c22.3-6.21,35.07-38.9,48.51-50.6a66.61,66.61,0,0,1,14.35-9.42,58.67,58.67,0,0,1-21.26,4.09c-19.75,0-37.75-10.49-48.31-24,1,1.39,13,15.46,22.29,43.72A30,30,0,0,1,51.46,158.37Z"/>
|
||||||
|
<path class="cls-4" d="M145.33,59.56c-2.08,22.29-28.26,46.26-58,46.26-29.95,0-55.88-24.12-58-46.26-1.45-15.6,7.34-36,58-36S146.78,44,145.33,59.56Z"/>
|
||||||
|
<path class="cls-5" d="M135.36,0h0a51.59,51.59,0,0,0-4.68,32.1A37.21,37.21,0,0,1,134,34.24c10,7.23,12.12,17,11.34,25.32a35.2,35.2,0,0,1-1.6,7.61A73.45,73.45,0,0,0,142.08,12,71.18,71.18,0,0,0,135.36,0Z"/>
|
||||||
|
<path class="cls-6" d="M130.68,32.1A51.59,51.59,0,0,1,135.36,0h0a57.92,57.92,0,0,0-9.41,6.87,59.8,59.8,0,0,0-14,18.75q3.35.64,6.29,1.45A53.09,53.09,0,0,1,130.68,32.1Z"/>
|
||||||
|
<path class="cls-7" d="M39.39,0h0a51.59,51.59,0,0,1,4.68,32.1,37.21,37.21,0,0,0-3.31,2.14c-10,7.23-12.12,17-11.34,25.32A35.2,35.2,0,0,0,31,67.17,73.45,73.45,0,0,1,32.67,12,71.18,71.18,0,0,1,39.39,0Z"/>
|
||||||
|
<path class="cls-8" d="M48.81,6.87A57.92,57.92,0,0,0,39.39,0h0a51.59,51.59,0,0,1,4.68,32.1,53.09,53.09,0,0,1,12.45-5q2.94-.82,6.29-1.45A59.8,59.8,0,0,0,48.81,6.87Z"/>
|
||||||
|
<g class="cls-9">
|
||||||
|
<path class="cls-10" d="M84.24,182.6c-26.08,0-49.56,5.42-66,14.08,14.54,18.33,36.47,30,61,30,11.19,0,29-3.38,43.66-13.61A58.81,58.81,0,0,0,141,192.47C125.56,186.3,105.79,182.6,84.24,182.6Z"/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<g class="cls-11">
|
||||||
|
<path class="cls-12" d="M138.51,52.94c-.56-2.94-2-5.19-5-5.88-7.88-1.85-27,9.84-37.8,15.34-4,2.06-6.16,3.05-8.34,3s-4.31-.94-8.34-3c-10.77-5.5-29.92-17.18-37.8-15.34-3,.7-4.44,2.94-5,5.88-1,5.16.35,18,9.89,27.49,7.14,7.11,16.68,10.46,24.69,12.71l.18.08a4.2,4.2,0,0,0-.09.88c0,3.28,3.83,5.94,8.56,5.94,2.34,0,6.35-.65,7.9-1.71h0c1.55,1.06,5.56,1.71,7.9,1.71,4.73,0,8.56-2.66,8.56-5.94a4.2,4.2,0,0,0-.09-.88l.18-.08c8-2.25,17.56-5.6,24.69-12.71C138.16,70.92,139.49,58.1,138.51,52.94Z"/>
|
||||||
|
</g>
|
||||||
|
<path class="cls-13" d="M75.26,75.35C64.56,86.85,47.81,77.09,45,63.28c-1.83-9.07,3.63-7.73,8.71-5.67C60.14,60.2,68.84,66.27,75.26,75.35Z"/>
|
||||||
|
<path class="cls-14" d="M60.43,68.26a15.16,15.16,0,0,1-2.19,8,15.56,15.56,0,0,1,0-15.92A15.16,15.16,0,0,1,60.43,68.26Z"/>
|
||||||
|
<path d="M87.36,86.64a8.15,8.15,0,0,0-6.27,2.49c8.25,5.17,4.31,5.17,12.55,0A8.15,8.15,0,0,0,87.36,86.64Z"/>
|
||||||
|
<path class="cls-15" d="M99.86,75.35c10.69,11.5,27.45,1.74,30.23-12.07,1.83-9.07-3.63-7.73-8.71-5.67C115,60.2,106.28,66.27,99.86,75.35Z"/>
|
||||||
|
<path class="cls-14" d="M114.69,68.26a15.16,15.16,0,0,0,2.19,8,15.56,15.56,0,0,0,0-15.92A15.16,15.16,0,0,0,114.69,68.26Z"/>
|
||||||
|
</g>
|
||||||
|
<path class="cls-16" d="M9.71,148.35c5.86,9.22,16.85,15.37,26.26,15.43a23.7,23.7,0,0,0,8.21-1.41l0,0c-15,4.18-19.32-25.16-10.92-43.06v0c1.09-3.38,2.35-6.34,3.42-8.83.37-.86,2.53-5.15,2.09-9.8-.84-9-14-17.33-24-5.37A44.52,44.52,0,0,0,9.39,104C3.55,116.06,1.08,134.76,9.71,148.35Z"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 9.2 KiB |
|
|
@ -139,10 +139,22 @@
|
||||||
margin: 10px;
|
margin: 10px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@media (max-width: 1140px) {
|
||||||
|
.footer {
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1000px) {
|
||||||
|
.footer-social {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@media (max-width: 768px) {
|
@media (max-width: 768px) {
|
||||||
.footer {
|
.footer {
|
||||||
.footer-social {
|
.footer-main {
|
||||||
display: none;
|
margin-bottom: 30px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1407,7 +1407,7 @@ Filter the table to find desired data.
|
||||||
### Custom column template
|
### Custom column template
|
||||||
|
|
||||||
Customize table column so it can be integrated with other components.
|
Customize table column so it can be integrated with other components.
|
||||||
:::demo You have access to the following data: row, column, $index and store (state management of Table) by [Scoped slot](https://vuejs.org/v2/guide/components.html#Scoped-Slots). (Scoped slots is supported from `1.1`, `inline-template` still works, but it's not recommended).
|
:::demo You have access to the following data: row, column, $index and store (state management of Table) by [Scoped slot](https://vuejs.org/v2/guide/components.html#Scoped-Slots).
|
||||||
```html
|
```html
|
||||||
<template>
|
<template>
|
||||||
<el-table
|
<el-table
|
||||||
|
|
@ -1944,8 +1944,8 @@ You can customize row index in `type=index` columns.
|
||||||
| current-row-key | key of current row, a set only prop | string,number | — | — |
|
| current-row-key | key of current row, a set only prop | string,number | — | — |
|
||||||
| row-class-name | function that returns custom class names for a row, or a string assigning class names for every row | Function({row, rowIndex})/String | — | — |
|
| row-class-name | function that returns custom class names for a row, or a string assigning class names for every row | Function({row, rowIndex})/String | — | — |
|
||||||
| row-style | function that returns custom style for a row, or an object assigning custom style for every row | Function({row, rowIndex})/Object | — | — |
|
| row-style | function that returns custom style for a row, or an object assigning custom style for every row | Function({row, rowIndex})/Object | — | — |
|
||||||
| cell-class-name | function that returns custom class names for a cell, or a string assigning class names for every cell | Function({row, rowIndex})/String | — | — |
|
| cell-class-name | function that returns custom class names for a cell, or a string assigning class names for every cell | Function({row, column, rowIndex, columnIndex})/String | — | — |
|
||||||
| cell-style | function that returns custom style for a cell, or an object assigning custom style for every cell | Function({row, rowIndex})/Object | — | — |
|
| cell-style | function that returns custom style for a cell, or an object assigning custom style for every cell | Function({row, column, rowIndex, columnIndex})/Object | — | — |
|
||||||
| header-row-class-name | function that returns custom class names for a row in table header, or a string assigning class names for every row in table header | Function({row, rowIndex})/String | — | — |
|
| header-row-class-name | function that returns custom class names for a row in table header, or a string assigning class names for every row in table header | Function({row, rowIndex})/String | — | — |
|
||||||
| header-row-style | function that returns custom style for a row in table header, or an object assigning custom style for every row in table header | Function({row, rowIndex})/Object | — | — |
|
| header-row-style | function that returns custom style for a row in table header, or an object assigning custom style for every row in table header | Function({row, rowIndex})/Object | — | — |
|
||||||
| header-cell-class-name | function that returns custom class names for a cell in table header, or a string assigning class names for every cell in table header | Function({row, rowIndex})/String | — | — |
|
| header-cell-class-name | function that returns custom class names for a cell in table header, or a string assigning class names for every cell in table header | Function({row, rowIndex})/String | — | — |
|
||||||
|
|
|
||||||
|
|
@ -1408,7 +1408,7 @@ Filtra la tabla para encontrar la información que necesita.
|
||||||
|
|
||||||
Personalice la columna de la tabla para que pueda integrarse con otros componentes.
|
Personalice la columna de la tabla para que pueda integrarse con otros componentes.
|
||||||
|
|
||||||
:::demo Tiene acceso a la siguiente informacion: row, column, $index, store (gestor de estados de la tabla) por [Scoped slots](https://vuejs.org/v2/guide/components.html#Scoped-Slots). (Los Scoped Slots son soportados desde `1.1`, `inline-template` todavía funciona, pero no es recomendado).
|
:::demo Tiene acceso a la siguiente informacion: row, column, $index, store (gestor de estados de la tabla) por [Scoped slots](https://vuejs.org/v2/guide/components.html#Scoped-Slots).
|
||||||
```html
|
```html
|
||||||
<template>
|
<template>
|
||||||
<el-table
|
<el-table
|
||||||
|
|
@ -1949,8 +1949,8 @@ Puede personalizar el índice de la fila con la propiedad `type=index` de las co
|
||||||
| current-row-key | clave de la fila actual, un ajuste de propiedad única | string,number | — | — |
|
| current-row-key | clave de la fila actual, un ajuste de propiedad única | string,number | — | — |
|
||||||
| row-class-name | función que devuelve nombres de clases personalizadas para una fila, o una cadena asignando nombres de clases para cada fila | Function({row, rowIndex})/String | — | — |
|
| row-class-name | función que devuelve nombres de clases personalizadas para una fila, o una cadena asignando nombres de clases para cada fila | Function({row, rowIndex})/String | — | — |
|
||||||
| row-style | función que devuelve el estilo personalizado para una fila, o un objeto asignando estilos personalizado para cada fila | Function({row, rowIndex})/Object | — | — |
|
| row-style | función que devuelve el estilo personalizado para una fila, o un objeto asignando estilos personalizado para cada fila | Function({row, rowIndex})/Object | — | — |
|
||||||
| cell-class-name | función que devuelve nombres de clases personalizadas para una celda, o una cadena asignando nombres de clases para cada celda | Function({row, rowIndex})/String | — | — |
|
| cell-class-name | función que devuelve nombres de clases personalizadas para una celda, o una cadena asignando nombres de clases para cada celda | Function({row, column, rowIndex, columnIndex})/String | — | — |
|
||||||
| cell-style | función que devuelve estilos personalizados para una celda, o un objeto asignado a estilos personalizados para cada celda | Function({row, rowIndex})/Object | — | — |
|
| cell-style | función que devuelve estilos personalizados para una celda, o un objeto asignado a estilos personalizados para cada celda | Function({row, column, rowIndex, columnIndex})/Object | — | — |
|
||||||
| header-row-class-name | función que devuelve nombre de clases personalizadas para una fila en la cabecera de la tabla, o una cadena asignando nombres de clases para cada fila en la cabecera de la tabla | Function({row, rowIndex})/String | — | — |
|
| header-row-class-name | función que devuelve nombre de clases personalizadas para una fila en la cabecera de la tabla, o una cadena asignando nombres de clases para cada fila en la cabecera de la tabla | Function({row, rowIndex})/String | — | — |
|
||||||
| header-row-style | función que devuelve estilos personalizados para una fila en la cabecera de la tabla, o un objeto asignando estilos personalizados para cada fila en la cabecera de la tabla | Function({row, rowIndex})/Object | — | — |
|
| header-row-style | función que devuelve estilos personalizados para una fila en la cabecera de la tabla, o un objeto asignando estilos personalizados para cada fila en la cabecera de la tabla | Function({row, rowIndex})/Object | — | — |
|
||||||
| header-cell-class-name | función que devuelve nombre de clases personalizadas para una celda en la cabecera de la tabla, o una cadena asignando nombres de clases para cada celda en la cabecera de la tabla | Function({row, rowIndex})/String | — | — |
|
| header-cell-class-name | función que devuelve nombre de clases personalizadas para una celda en la cabecera de la tabla, o una cadena asignando nombres de clases para cada celda en la cabecera de la tabla | Function({row, rowIndex})/String | — | — |
|
||||||
|
|
|
||||||
|
|
@ -1449,7 +1449,7 @@
|
||||||
### 自定义列模板
|
### 自定义列模板
|
||||||
|
|
||||||
自定义列的显示内容，可组合其他组件使用。
|
自定义列的显示内容，可组合其他组件使用。
|
||||||
:::demo 通过 `Scoped slot` 可以获取到 row, column, $index 和 store（table 内部的状态管理）的数据，用法参考 demo。(`1.1` 后支持通过 [Scoped slot](https://vuejs.org/v2/guide/components.html#Scoped-Slots) 自定义模板。之前的 `inline-template` 同样适用，但不推荐。)
|
:::demo 通过 `Scoped slot` 可以获取到 row, column, $index 和 store（table 内部的状态管理）的数据，用法参考 demo。
|
||||||
```html
|
```html
|
||||||
<template>
|
<template>
|
||||||
<el-table
|
<el-table
|
||||||
|
|
@ -2008,7 +2008,7 @@
|
||||||
| row-class-name | 行的 className 的回调方法，也可以使用字符串为所有行设置一个固定的 className。 | Function({row, rowIndex})/String | — | — |
|
| row-class-name | 行的 className 的回调方法，也可以使用字符串为所有行设置一个固定的 className。 | Function({row, rowIndex})/String | — | — |
|
||||||
| row-style | 行的 style 的回调方法，也可以使用一个固定的 Object 为所有行设置一样的 Style。 | Function({row, rowIndex})/Object | — | — |
|
| row-style | 行的 style 的回调方法，也可以使用一个固定的 Object 为所有行设置一样的 Style。 | Function({row, rowIndex})/Object | — | — |
|
||||||
| cell-class-name | 单元格的 className 的回调方法，也可以使用字符串为所有单元格设置一个固定的 className。 | Function({row, column, rowIndex, columnIndex})/String | — | — |
|
| cell-class-name | 单元格的 className 的回调方法，也可以使用字符串为所有单元格设置一个固定的 className。 | Function({row, column, rowIndex, columnIndex})/String | — | — |
|
||||||
| cell-style | 单元格的 style 的回调方法，也可以使用一个固定的 Object 为所有单元格设置一样的 Style。 | Function({row, rowIndex, rowIndex, columnIndex})/Object | — | — |
|
| cell-style | 单元格的 style 的回调方法，也可以使用一个固定的 Object 为所有单元格设置一样的 Style。 | Function({row, column, rowIndex, columnIndex})/Object | — | — |
|
||||||
| header-row-class-name | 表头行的 className 的回调方法，也可以使用字符串为所有表头行设置一个固定的 className。 | Function({row, rowIndex})/String | — | — |
|
| header-row-class-name | 表头行的 className 的回调方法，也可以使用字符串为所有表头行设置一个固定的 className。 | Function({row, rowIndex})/String | — | — |
|
||||||
| header-row-style | 表头行的 style 的回调方法，也可以使用一个固定的 Object 为所有表头行设置一样的 Style。 | Function({row, rowIndex})/Object | — | — |
|
| header-row-style | 表头行的 style 的回调方法，也可以使用一个固定的 Object 为所有表头行设置一样的 Style。 | Function({row, rowIndex})/Object | — | — |
|
||||||
| header-cell-class-name | 表头单元格的 className 的回调方法，也可以使用字符串为所有表头单元格设置一个固定的 className。 | Function({row, column, rowIndex, columnIndex})/String | — | — |
|
| header-cell-class-name | 表头单元格的 className 的回调方法，也可以使用字符串为所有表头单元格设置一个固定的 className。 | Function({row, column, rowIndex, columnIndex})/String | — | — |
|
||||||
|
|
|
||||||
|
|
@ -19,10 +19,34 @@
|
||||||
margin: 10px 0 5px;
|
margin: 10px 0 5px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.sponsor {
|
||||||
|
margin: 0 auto 50px;
|
||||||
|
display: flex;
|
||||||
|
width: 400px;
|
||||||
|
height: 100px;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
img {
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
div {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
margin: 0;
|
||||||
|
line-height: 1.8;
|
||||||
|
color: #999;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
.jumbotron {
|
.jumbotron {
|
||||||
width: 890px;
|
width: 890px;
|
||||||
height: 465px;
|
height: 465px;
|
||||||
margin: 30px auto 100px;
|
margin: 30px auto;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
div {
|
div {
|
||||||
|
|
@ -183,6 +207,7 @@
|
||||||
width: 100%;
|
width: 100%;
|
||||||
.container {
|
.container {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
margin: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.banner .container {
|
.banner .container {
|
||||||
|
|
@ -259,6 +284,13 @@
|
||||||
<img class="jumbotron-compo-3" src="~examples/assets/images/compo-3.png" alt="">
|
<img class="jumbotron-compo-3" src="~examples/assets/images/compo-3.png" alt="">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<a class="sponsor" href="https://tipe.io/?ref=element" target="_blank">
|
||||||
|
<img width="35px" src="~examples/assets/images/tipe.svg" alt="tipe.io">
|
||||||
|
<div>
|
||||||
|
<p>Sponsored by Tipe.io</p>
|
||||||
|
<p>Next Generation Headless CMS</p>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
<div class="cards">
|
<div class="cards">
|
||||||
<ul class="container">
|
<ul class="container">
|
||||||
<li>
|
<li>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue