onsubmit 事件不适用于 Lightning 记录编辑表单

Question

According to the Lightning Web Component documentation, https://developer.salesforce.com/docs/component-library/bundle/lightning-record-edit-form/documentation , you should be able to create an onsubmit event and prevent the form from正在提交。

这似乎不起作用。 这是一个重现问题的简单组件。

<template>
  <lightning-record-edit-form object-api-name="Account" onsubmit={handleSubmit}>
    <lightning-input-field field-name="Name" value={value}> </lightning-input-field>
  </lightning-record-edit-form>
</template>

import { LightningElement } from 'lwc';

export default class FormSubmit extends LightningElement {
  value = 'Put cursor here, hit enter';

  handleSubmit(event) {
    event.preventDefault();
    console.log('This is not happening!!!');
    return false;
  }
}

将您的 cursor 放在该字段中，然后按 Enter 键。 页面将刷新，handleSubmit function 永远不会被调用。

我觉得我在这里发疯了……这是一个错误吗？ 文档有错吗？ 我错过了什么明显的东西吗？ 请帮忙！！！

Answer 1

这是修复，确保表单包含一个按钮！ 而已！

<template>
  <lightning-record-edit-form object-api-name="Account" onsubmit={handleSubmit}>
    <lightning-input-field field-name="Name" value={value}> </lightning-input-field>
    <lightning-button variant="brand" type="submit" label="Save"> </lightning-button>
  </lightning-record-edit-form>
</template>

当然，在花费数小时调试此问题后，我在发布此问题 30 分钟后找到了解决方案。

我没有按钮的原因是我将此表单用于内联编辑功能，并且不需要按钮，因为我正在单独处理保存而无需用户单击提交。 我可以简单地用一些 CSS 隐藏按钮。