57 lines
		
	
	
		
			1.6 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			57 lines
		
	
	
		
			1.6 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <!DOCTYPE html>
 | |
| <!-- sheetjs (C) 2013-present  SheetJS https://sheetjs.com -->
 | |
| <!-- vim: set ts=2: -->
 | |
| <html>
 | |
| <head>
 | |
|   <title>SheetJS + VueJS3</title>
 | |
|   <!-- Vue 2 -->
 | |
|   <script src="https://unpkg.com/vue@3.x"></script>
 | |
| 
 | |
|   <script src="https://cdn.sheetjs.com/xlsx-latest/package/dist/shim.min.js"></script>
 | |
|   <script src="https://cdn.sheetjs.com/xlsx-latest/package/dist/xlsx.full.min.js"></script>
 | |
| 
 | |
|   <!-- SheetJS Vue components -->
 | |
|   <script src="SheetJS-vue.js"></script>
 | |
| 
 | |
| <style>
 | |
| .grid1 {
 | |
|   width: 500px;
 | |
|   height: 400px;
 | |
| };
 | |
| </style>
 | |
| </head>
 | |
| <body>
 | |
| <pre>
 | |
| <b><a href="https://sheetjs.com">SheetJS + VueJS3 demo</a></b>
 | |
| 
 | |
| This demo shows a sample Vue component "html-preview" that:
 | |
| - displays a file input that accepts a spreadsheet file
 | |
| - draws the first worksheet of a submitted file as HTML
 | |
| - presents an export button to generate XLSX files
 | |
| 
 | |
| <a href="https://obamawhitehouse.archives.gov/sites/default/files/omb/budget/fy2014/assets/receipts.xls">Sample Spreadsheet</a>
 | |
| </pre>
 | |
| <script type="text/javascript">
 | |
|   var _gaq = _gaq || [];
 | |
|   _gaq.push(['_setAccount', 'UA-36810333-1']);
 | |
|   _gaq.push(['_trackPageview']);
 | |
| 
 | |
|   (function() {
 | |
|     var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
 | |
|     ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
 | |
|     var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
 | |
|   })();
 | |
| </script>
 | |
| 
 | |
| <div id="app">
 | |
|   <html-preview></html-preview>
 | |
| </div>
 | |
| 
 | |
| <script lang="javascript">
 | |
| if(Vue.component) var app = new Vue({ el: '#app' });
 | |
| else app.mount('#app');
 | |
| </script>
 | |
| </body>
 | |
| </html>
 | |
| 
 |