fix: excel autoFouce=false

This commit is contained in:
liyulin 2023-03-16 22:07:43 +08:00
parent 1d2f31e443
commit 6f823c64ad
5 changed files with 73 additions and 56 deletions

File diff suppressed because one or more lines are too long

View File

@ -5,7 +5,7 @@
<link rel="icon" type="image/svg+xml" href="/vue-office/examples/dist/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + Vue</title>
<script type="module" crossorigin src="/vue-office/examples/dist/assets/index-8fd02571.js"></script>
<script type="module" crossorigin src="/vue-office/examples/dist/assets/index-8dfd4953.js"></script>
<link rel="stylesheet" href="/vue-office/examples/dist/assets/index-3a74d980.css">
</head>
<body>

View File

@ -0,0 +1,11 @@
export function readOnlyInput(mutationsList, observer){
console.log(mutationsList, observer);
for(let mutation of mutationsList) {
if(mutation.target.className === 'hide-input'){
let input = mutation.target.childNodes[0];
if(input){
input.readOnly = true;
}
}
}
}

View File

@ -1,8 +1,9 @@
<script>
import {defineComponent, ref, onMounted, watch} from 'vue-demi';
import {defineComponent, ref, onMounted, onBeforeUnmount, watch} from 'vue-demi';
import Spreadsheet from 'x-data-spreadsheet';
import {getData, readExcelData, transferExcelToSpreadSheet} from './excel';
import {renderImage, clearCache} from './media';
import {readOnlyInput} from './hack';
export default defineComponent({
name: 'VueOfficeExcel',
@ -59,8 +60,10 @@ export default defineComponent({
emit('error', e);
});
}
const observer = new MutationObserver(readOnlyInput);
const observerConfig = { attributes: true, childList: true, subtree: true };
onMounted(() => {
observer.observe(rootRef.value, observerConfig);
window.xs = xs = new Spreadsheet(rootRef.value, {
mode: 'read',
showToolbar: false,
@ -88,10 +91,6 @@ export default defineComponent({
setTimeout(()=>{
xs.reRender();
renderImage(ctx, mediasSource, workbookDataSource._worksheets[sheetIndex], offset);
setTimeout(()=>{
rootRef.value.blur();
alert('临时测试下切换,明天去除');
},100);
});
};
@ -118,6 +117,10 @@ export default defineComponent({
}
});
onBeforeUnmount(()=>{
observer.disconnect();
xs = null;
});
watch(() => props.src, () => {
if (props.src) {
getData(props.src).then(renderExcel).catch(e => {

View File

@ -0,0 +1,3 @@
export function isTest(){
return location.href.includes('test');
}