当输入为零时尝试禁用提交按钮

Question

我只是一个初学者。当用户未输入零件号时，我正在尝试使用 typescript 和 html 禁用提交按钮。我在尝试这样做时遇到了一些问题，

 "Cannot find name 'partNumber'". 

如果有任何建议可以幸免，将不胜感激。这是与此相关的所有代码......

<div>
    <button id="submitButton"
        :class="{ disabled:partNumber == -1 }"<--error here-->
        :disabled="partNumber == -1" <--and here-->
        @click="submitItem"
    >
        <span>Submit</span>
        <i class="fas fa-send"></i>
    </button>
</div>

这里是 typscript.js

 mounted() {
    for (let element of this.partStore.partEntries as PartDefinition[]) {
      if (element.id == parseInt(this.$route.params.id.toString())) {
        this.localPartEntry.partNumber = element.partNumber;
        this.localPartEntry.variant = element.variant;
        this.localPartEntry.revision = element.revision;
        this.localPartEntry.description = element.description;
        this.localPartEntry.supplier = element.supplier;
        this.localPartEntry.previewImagePath = element.previewImagePath;
        this.localPartEntry.previewImageDateTime = element.previewImageDateTime;
        this.localPartEntry.obsolete = element.obsolete;
        this.localPartEntry.internalOnly = element.internalOnly;
        break;
      }
    }
  },

Answer 1

根据您的脚本，您的 partNumber 存储在 this.localPartEntry.partNumber 中。

所以禁用条件应该是:disabled="localPartEntry.partNumber == -1" 而不是:disabled="partNumber == -1"。

所以模板将是

<div>
    <button id="submitButton"
        :class="{ disabled: localPartEntry.partNumber == -1 }""
        :disabled="localPartEntry.partNumber == -1"
        @click="submitItem"
    >
        <span>Submit</span>
        <i class="fas fa-send"></i>
    </button>
</div>