Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 | <template> <u-linear-layout direction="vertical"> <u-linear-layout> <u-button @click="changeList" id="changelistbutton">变换list值</u-button> </u-linear-layout> <u-list-view ref="listview" v-model="value" :data-source="list" :page-size="pageSize" :page-number="pageNumber" :pageable="true" :show-sizer="true" :page-size-options="[10,20,50]" @page="onPage"> </u-list-view> </u-linear-layout> </template> <script> export default { data() { return { value: 'cpp', initialList: [ { text: 'Batch', value: 'bat' }, { text: 'C', value: 'c' }, { text: 'C#', value: 'csharp' }, { text: 'C++', value: 'cpp' }, { text: 'CSS', value: 'css' }, { text: 'Clojure', value: 'clojure' }, { text: 'CoffeeScript', value: 'coffeescript' }, { text: 'Coq', value: 'coq' }, { text: 'Diff', value: 'diff' }, { text: 'Dockerfile', value: 'dockerfile' }, { text: 'F#', value: 'fshape' }, { text: 'Go', value: 'go' }, { text: 'Groovy', value: 'groovy' }, { text: 'HLSL', value: 'hlsl' }, { text: 'HTML', value: 'html' }, { text: 'Handlebars', value: 'Handlebars' }, { text: 'Ignore', value: 'ignore' }, { text: 'Ini', value: 'ini' }, { text: 'JSON', value: 'json' }, { text: 'Java', value: 'java' }, { text: 'JavaScript', value: 'javascript' }, { text: 'Jinja', value: 'jinja' }, { text: 'Jupyter', value: 'jupyter' }, { text: 'Less', value: 'less' }, { text: 'Log', value: 'log' }, { text: 'Lua', value: 'lua' }, { text: 'Makefile', value: 'makefile' }, { text: 'Markdown', value: 'markdown' }, { text: 'Objective-C', value: 'objective-c' }, { text: 'Objective-C++', value: 'objective-cpp' }, { text: 'PHP', value: 'php' }, { text: 'Perl', value: 'perl' }, { text: 'PowerShell', value: 'powershell' }, { text: 'Properties', value: 'properties' }, { text: 'Pug', value: 'jade' }, { text: 'Python', value: 'python' }, { text: 'R', value: 'r' }, { text: 'Razor', value: 'razor' }, { text: 'Ruby', value: 'ruby' }, { text: 'Rust', value: 'rust' }, { text: 'SCSS', value: 'scss' }, { text: 'SQL', value: 'sql' }, { text: 'SVG', value: 'svg' }, { text: 'Shaderlab', value: 'shaderlab' }, { text: 'Shell Script', value: 'shellscript' }, { text: 'Swift', value: 'swift' }, { text: 'TypeScript', value: 'typescript' }, { text: 'Visual Basic', value: 'vb' }, { text: 'Vue', value: 'vue' }, { text: 'XML', value: 'xml' }, { text: 'XSL', value: 'xsl' }, { text: 'YAML', value: 'yaml' }, ], list: [], count: 0, pageSize: 20, pageNumber: 1, }; }, created() { this.changeList(); }, methods: { changeList() { this.count = this.count + 1; this.list = this.initialList.map((item) => { item.text = item.text + this.count; return item; }); }, onPage(paging) { this.pageSize = paging.size; this.pageNumber = paging.number; }, } }; </script> |