首页vue-virtual-scroll-list cdn引入

vue-virtual-scroll-list cdn引入

时间: 2023-10-31 17:18:30 浏览: 158

virtual-list-scroll

安装 npm i virtual-list-item 进口 import Vue from " vue " import VirtualListScroll from " virtual-list-scroll " Vue.use(VirtualListScroll) 用法页面模式 < VirtualListScroll xss=removed> < template xss=removed></ template> </ VirtualListScroll> 容器模式 < VirtualListScroll xss=removed xss=removed xss=removed> < template xss=removed> </ t

要在Vue项目中引入vue-virtual-scroll-list，你可以使用CDN链接来加载它。你可以在你的HTML文件中添加以下代码： ```html <!DOCTYPE html> <html> <head>  <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>  <script src="https://cdn.jsdelivr.net/npm/vue-virtual-scroll-list@1.0.0/dist/index.js"></script> </head> <body>  <div id="app">  <virtual-list :size="50" :remain="10" :data="yourDataArray"> <template slot-scope="{ item }">  {{ item }} </template> </virtual-list> </div>  <script> new Vue({ el: '#app', data: { yourDataArray: ['Item 1', 'Item 2', 'Item 3', ...] // 你的数据数组 } }) </script> </body> </html> ``` 请确保将`https://cdn.jsdelivr.net/npm/vue/dist/vue.js`和`https://cdn.jsdelivr.net/npm/vue-virtual-scroll-list@1.0.0/dist/index.js`替换为最新版本的CDN链接。另外，还需提供自己的数据数组以替代`yourDataArray`。这样，你就成功引入了vue-virtual-scroll-list组件。

阅读全文