Requirements: Page displays docx file
Use plugin:, and the plugin dependencies
1、 address：/ajax/libs/jszip/3.10.0/ 2、 address： /VolodymyrBaydalka/docxjs //The self-test project uses vue3、address：/npm/vue/dist/
Plugin usage example
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div >
<input type="file" @change="upload">
<div ref="file"></div>
</div>
<script src="./"></script>
<script src="./"></script>
<script src="./" type="text/javascript"></script>
<script>
var app = new Vue({
el: '#app',
data: {
file: null
},
mounted(){
("./****.docx");//Local document address: ./****.docx },
methods: {
//1. Preload the display document through input upload(e) {
= [0]
('=-======',)
(, this.$);
},
//2. Directly request local documents getApi(path){
let _that = this;
let xhr = new XMLHttpRequest();
('GET', path, true);
= 'blob';
= function (e) {
if ( == 200) {
//Docx document blob object type value is: //application/
let blob = new Blob([], {type: 'application/'});
// Use blob objects to operate ('blob=====',blob)
(blob, _that.$);
}
};
();
}
}
})
</script>
</body>
</html>Summarize
This is the article about displaying docx files using the plug-in docx-preview on the js front-end page. For more related js front-end display docx files, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!