Tajuk yang ditulis semula ialah: VueJS Typescript jenis v-model 'nombor' tidak boleh diberikan untuk menaip 'Nullable<string>'

Question

Jadi saya baru menggunakan Typescript dan VueJS serta semua ciri baharunya.

Semuanya berfungsi seperti yang diharapkan, tetapi saya tidak dapat menyingkirkan ralat skrip taip dan menggunakan model v pada masa yang sama.

Saya sedang membangunkan paparan rangkaian untuk ahli memeriksa dan menukar sifat mereka. Saya mendapat data ahli daripada API dan menyimpannya dalam PiniaStore. Ini bermakna saya mempunyai beberapa medan input yang memerlukan ahli menjadi nombor dan rentetan. AFAIK v-model ialah pilihan terbaik untuk medan input.

 Taipkan 'nombor rentetan |.
  Taip 'nombor' tidak boleh diberikan untuk menaip 'Nullable'.

Tiada penyelesaian yang dicadangkan untuk soalan stackoverflow tentang ralat ini (seperti yang ini atau yang ini) sesuai dengan masalah saya. Saya menemui penyelesaian yang buruk, saya tidak suka menggunakan acara perubahan dalam blok templat dan bukannya model v dan saya mendapat ralat yang sama dalam skrip saya tetapi dengan //@ts-ignore< 
Pertama sekali, perkara yang saya benar-benar minta ialah cara mengulas ralat skrip taip dalam blok templat VueJs, yang telah ditanya di sini. 

Kedua, bagaimana saya boleh menyelesaikan masalah ini tanpa mendapat ralat skrip taip? 
Melihat kod di bawah, saya mendapat ralat ini di v-model

Answer 1

Saya rasa anda sedang mentakrifkan membership: Member|null 来检查加载程序

Boleh cuba ni

export type MembershipStoreState = {
  membership: Member;
};

Dalam HTML

<template>
  <div v-if="Object.keys(membership).length === 0" class="loading">
    <h2>Loading</h2>
  </div>
  <div v-else class="members-table">
    <div v-for="(value, key) in membership" > // thanks to @Dimava's comment
      <br />
      <InputNumber v-if = "key === 'id' || key === 'user_id'"
        v-model="membership[key]"
      />
      <InputText type="text" v-else
        v-model="membership[key]"
      />
    </div>
    <Button @click="save()" />
  </div>
</template>

Object.keys(membership).length === 0 将检查您是否已填充界面的任何键，否则它将返回 true 并且您的正在加载akan kelihatan