docx预览手机端样式兼容

This commit is contained in:
liyulin 2023-01-31 10:04:49 +08:00
parent ee2c2ca13c
commit f728bf25c7
11 changed files with 25 additions and 9 deletions

View File

@ -36,6 +36,8 @@ npm install @vue-office/pdf
<script>
//引入VueOfficeDocx组件
import VueOfficeDocx from '@vue-office/docx'
//引入相关样式
import '@vue-office/docx/lib/index.css'
export default {
components:{
@ -70,6 +72,7 @@ export default {
<script>
import VueOfficeDocx from '@vue-office/docx'
import '@vue-office/docx/lib/index.css'
export default {
components: {
VueOfficeDocx
@ -106,6 +109,7 @@ export default {
<script>
import VueOfficeDocx from '@vue-office/docx'
import '@vue-office/docx/lib/index.css'
export default {
components: {

File diff suppressed because one or more lines are too long

1
examples/dist/css/index.4050eec4.css vendored Normal file

File diff suppressed because one or more lines are too long

View File

@ -1 +1 @@
<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/vue-office/examples/dist/favicon.ico"><title>vue-office</title><script defer="defer" src="/vue-office/examples/dist/js/chunk-vendors.55971386.js"></script><script defer="defer" src="/vue-office/examples/dist/js/index.7d0a43ac.js"></script><link href="/vue-office/examples/dist/css/chunk-vendors.4ae079ec.css" rel="stylesheet"><link href="/vue-office/examples/dist/css/index.2f78804d.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but vue-office doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html>
<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/vue-office/examples/dist/favicon.ico"><title>vue-office</title><script defer="defer" src="/vue-office/examples/dist/js/chunk-vendors.55971386.js"></script><script defer="defer" src="/vue-office/examples/dist/js/index.86933ce2.js"></script><link href="/vue-office/examples/dist/css/chunk-vendors.4ae079ec.css" rel="stylesheet"><link href="/vue-office/examples/dist/css/index.4050eec4.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but vue-office doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

2
examples/dist/js/index.86933ce2.js vendored Normal file

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,6 +1,6 @@
{
"name": "vue-office",
"version": "0.0.13",
"version": "0.0.14",
"description": "通过Vue开发的办公文档预览组件支持docx、pdf、ppt、excel(已实现)的预览",
"author": "hit757",
"scripts": {

View File

@ -5,10 +5,11 @@
"main": "lib/index.js",
"author": "hit757",
"files": [
"lib/index.js"
"lib/index.js",
"lib/index.css"
],
"scripts": {
"copyFile": "cp lib/docx.umd.min.js lib/index.js && cp ../../README.md README.md",
"copyFile": "cp lib/docx.css lib/index.css && cp lib/docx.umd.min.js lib/index.js && cp ../../README.md README.md",
"build": "vue-cli-service build --target lib --dest lib index.js && npm run copyFile",
"clean": "rimraf lib"
},

View File

@ -51,6 +51,17 @@ export default {
}
</script>
<style scoped lang="less">
<style lang="less">
@media screen and (max-width: 800px){
.vue-office-docx {
.docx-wrapper {
padding: 10px;
> section.docx {
padding: 10px !important;
width: 100% !important;
}
}
}
}
</style>