Skip to content

Commit 21252c0

Browse files
committed
Create fixed-height.md
1 parent 4ea6c9e commit 21252c0

File tree

1 file changed

+65
-0
lines changed

1 file changed

+65
-0
lines changed
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
:::anchor 表格宽度固定
2+
3+
:::demo 表格的固定宽度,需要设置外层容器宽度。可以通过`style="width:900px"`方式设置。此处容器宽度为 900px
4+
5+
```html
6+
<template>
7+
<ve-table
8+
style="width:900px"
9+
:columns="columns"
10+
:table-data="tableData"
11+
:border-around="true"
12+
:border-x="true"
13+
:border-y="true"
14+
/>
15+
</template>
16+
17+
<script>
18+
export default {
19+
data() {
20+
return {
21+
columns: [
22+
{ field: "name", key: "a", title: "Name 100px", width: 100 },
23+
{ field: "date", key: "b", title: "Tel 200px", width: 200 },
24+
{ field: "hobby", key: "c", title: "Hobby 300px", width: 300 },
25+
{ field: "address", key: "d", title: "Address 300px", width: 300 },
26+
],
27+
tableData: [
28+
{
29+
name: "John",
30+
date: "1900-05-20",
31+
hobby: "coding and coding repeat",
32+
address: "No.1 Century Avenue, Shanghai",
33+
},
34+
{
35+
name: "Dickerson",
36+
date: "1910-06-20",
37+
hobby: "coding and coding repeat",
38+
address: "No.1 Century Avenue, Beijing",
39+
},
40+
{
41+
name: "Larsen",
42+
date: "2000-07-20",
43+
hobby: "coding and coding repeat",
44+
address: "No.1 Century Avenue, Chongqing",
45+
},
46+
{
47+
name: "Geneva",
48+
date: "2010-08-20",
49+
hobby: "coding and coding repeat",
50+
address: "No.1 Century Avenue, Xiamen",
51+
},
52+
{
53+
name: "Jami",
54+
date: "2020-09-20",
55+
hobby: "coding and coding repeat",
56+
address: "No.1 Century Avenue, Shenzhen",
57+
},
58+
],
59+
};
60+
},
61+
};
62+
</script>
63+
```
64+
65+
:::

0 commit comments

Comments
 (0)