drip-public/iview
6
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

add example for dropdown placement bug

Browse source
This commit is contained in:
huanghong 2018-03-16 17:22:03 +08:00
parent 347815f7a3
commit 944c0dac7a
2 changed files with 69 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
examples/routers/page.vue
View file

@ -5,35 +5,24 @@
<Button type="primary" @click="subject">- 1</Button> <Button type="primary" @click="subject">- 1</Button>
<Button type="primary" @click="change">Change</Button> <Button type="primary" @click="change">Change</Button>
<Page :current="2" :total="50" simple></Page> <Page :current="2" :total="50" simple></Page>
<div style="margin:20px 0px">
<Page :total="total" show-sizer show-elevator show-total transfer :current.sync="current"></Page> <div style="margin:10px 0px">
<Page :total="1000" show-sizer show-elevator show-total transfer :current="12"></Page>
</div> </div>
<div style="margin:20px 0px"> <div style="margin:10px 0px">
<Page :total="total" show-sizer show-elevator show-total transfer :current.sync="current"></Page> <Page :total="1000" show-sizer show-elevator show-total transfer :current="12"></Page>
</div> </div>
<div style="margin:20px 0px"> <div style="margin:100px 0px">
<Page :total="total" show-sizer show-elevator show-total transfer :current.sync="current"></Page> <Page :total="500" show-sizer show-elevator show-total transfer ></Page>
</div> </div>
<div style="margin:20px 0px"> <div style="margin:100px 0px">
<Page :total="total" show-sizer show-elevator show-total transfer :current.sync="current"></Page> <Page :total="500" show-sizer show-elevator transfer ></Page>
</div> </div>
<div style="margin:20px 0px"> <div style="margin:100px 0px">
<Page :total="total" show-sizer show-elevator show-total transfer :current.sync="current"></Page> <Page :total="500" show-sizer show-elevator transfer ></Page>
</div> </div>
<div style="margin:20px 0px"> <div style="margin:10px 0px">
<Page :total="total" show-sizer show-elevator show-total transfer :current.sync="current"></Page> <Page :total="500" show-sizer transfer ></Page>
</div>
<div style="margin:20px 0px">
<Page :total="total" show-sizer show-elevator show-total transfer :current.sync="current"></Page>
</div>
<div style="margin:20px 0px">
<Page :total="total" show-sizer show-elevator show-total transfer :current.sync="current"></Page>
</div>
<div style="margin:20px 0px">
<Page :total="total" show-sizer show-elevator show-total transfer :current.sync="current"></Page>
</div>
<div style="margin:20px 0px">
<Page :total="total" show-sizer show-elevator show-total transfer :current.sync="current"></Page>
</div> </div>
</div> </div>
</template> </template>

56
examples/routers/table.vue
View file

@ -5,6 +5,14 @@
<Button @click="handleClearData">Clear Data</Button> <Button @click="handleClearData">Clear Data</Button>
<Button @click="handleSelectAll(true)">Set all selected</Button> <Button @click="handleSelectAll(true)">Set all selected</Button>
<Button @click="handleSelectAll(false)">Cancel all selected</Button> <Button @click="handleSelectAll(false)">Cancel all selected</Button>
<div style="margin:20px 0px;">
<Table :data="tableData1" :columns="tableColumns1" style="width: 100%;" stripe></Table>
<div style="margin: 10px;overflow: hidden">
<div style="float: right;">
<Page :total="100" show-sizer :current="1" @on-change="changePage"></Page>
</div>
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
@ -32,9 +40,40 @@
], ],
data1: [ data1: [
],
tableData1: [],
tableColumns1: [
{
title: 'Data1',
key: 'data1'
},
{
title: 'Data2',
key: 'data2'
},
{
title: 'Data3',
key: 'data3'
},
{
title: 'Data4',
key: 'data4'
},
{
title: 'Data5',
key: 'data5'
},
{
title: 'Data6',
key: 'data6'
},
] ]
} }
}, },
mounted(){
this.refreshData();
},
methods: { methods: {
handleSelectAll (status) { handleSelectAll (status) {
this.$refs.selection.selectAll(status); this.$refs.selection.selectAll(status);
@ -69,6 +108,23 @@
}, },
handleClearData () { handleClearData () {
this.data1 = []; this.data1 = [];
},
refreshData(){
let data = [];
for (let i = 0; i < 10; i++) {
data.push({
data1: Math.floor(Math.random () * 10000),
data2: Math.floor(Math.random () * 1000000),
data3: Math.floor(Math.random () * 100000000),
data4: Math.floor(Math.random () * Math.random () * 10000),
data5: Math.floor(Math.random () * Math.random () * 1000000),
data6: Math.floor(Math.random () * Math.random () * 100000000),
});
}
this.tableData1 = data;
},
changePage(){
this.refreshData();
} }
} }
} }