const spanElement = translationDataBox.value.quillEditor.getQuill().root.querySelector(`${spanId}`) console.log('tag',spanElement) console.log(11,translationDataBox.value.quillEditor.getQuill().getBounds(spanElement)) Cannot read properties of null (reading 'bottom')

这个错误可能是由于 `querySelector` 方法无法找到匹配的 `span` 元素而导致的。可以在控制台中使用 `console.log` 打印 `translationDataBox.value.quillEditor.getQuill().root` 的值，以确保它是一个有效的 DOM 元素。你还可以尝试在 `querySelector` 方法中打印 `spanId` 的值，以确保它是正确的。

如果这些都没有问题，那么可能是由于在调用 `getBounds` 方法时传递了一个 `null` 值（即 `spanElement` 可能为 `null`）。可以在调用 `getBounds` 方法之前添加一个条件语句，以确保 `spanElement` 不为 `null`。例如：

const spanElement = translationDataBox.value.quillEditor.getQuill().root.querySelector(`${spanId}`);

if (spanElement) {
  console.log('tag', spanElement);
  console.log(11, translationDataBox.value.quillEditor.getQuill().getBounds(spanElement));
}

这将确保只有在 `spanElement` 不为 `null` 时才调用 `getBounds` 方法。

相关问题

registerButton.addEventListener('click', function(event) { event.preventDefault(); const username = registerUsernameInput.value; const email = registerEmailInput.value; const password = registerPasswordInput.value; const confirmPassword = registerConfirmPasswordInput.value;

这段代码是为注册按钮 `registerButton` 添加了一个点击事件的监听器。当用户点击注册按钮时，会执行回调函数。回调函数中的第一条语句 `event.preventDefault()` 是用来阻止表单默认的提交行为。这是因为表单默认的提交行为会导致页面刷新，而我们希望在不刷新页面的情况下通过 AJAX 提交表单。

接下来，代码从表单中获取了用户名、电子邮箱、密码和确认密码等信息，并将其保存在对应的变量中：

const username = registerUsernameInput.value;
const email = registerEmailInput.value;
const password = registerPasswordInput.value;
const confirmPassword = registerConfirmPasswordInput.value;

其中，`registerUsernameInput`、`registerEmailInput`、`registerPasswordInput` 和 `registerConfirmPasswordInput` 是表单中对应的输入框元素。这些元素通常可以通过 `document.getElementById` 或 `document.querySelector` 方法来获取。

接下来的代码就是通过 AJAX 发送注册请求。具体实现可能会有所不同，但一般来说，会使用 `XMLHttpRequest` 对象或者 `fetch` API 来发送请求，并将表单数据作为请求体发送给服务器。

exportDataEvent(){ debugger; const xTable1 = this.$refs.table; console.log("xTable1：：："+xTable1) const $table = xTable1.value $table.exportData({ type: 'csv' }) },

你的代码中，获取 `vxe-table` 实例的方式是正确的，可以通过 `this.$refs.table` 获取到表格实例，但是在获取 `$table` 实例时，可能存在一些问题。

根据你提供的代码，$table 的获取方式是通过 `xTable1.value`，但是在 `vxe-table` 中，实例是通过 `xTable1.$xegrid` 获取的，因此可以尝试修改代码如下：

exportDataEvent() {
  const xTable1 = this.$refs.table;
  const $table = xTable1.$xegrid;
  $table.exportData({ type: 'csv' });
}

另外，如果你只是想导出表格数据，可以直接使用 `vxe-table` 内置的 `exportCsv` 方法，例如：

exportDataEvent() {
  const xTable1 = this.$refs.table;
  xTable1.exportCsv({ filename: 'table-data' });
}

这样就可以将表格数据导出为 CSV 格式的文件了，无需再手动指定类型。