求助:element-plus,v-model绑定null类型报错了!!!

257 阅读1分钟

在使用Select组件时,用v-mdodel绑定一个可为null的类型,如const value = ref<string | null>(""),vscode直接标红报错了。 但如果是 string | undefined就正常。
但现实是,某些情况下只能用null
比如调一个后端的接口,新增一个物品。有的后端就会报错,因为JSON.stringify会把undefined对应键给移除,导致后端收到的object与实体类键数量不匹配,会转换报错。 这个要怎么解决呢?
求助!!!👍👍💕

官方的文档

全局配置 | Element Plus,下图中的组件应该是可以设置为null的。

image.png

实际效果

编辑器提示类型不匹配, 版本最新版 "element-plus": "^2.9.5"

image.png

测试代码如下:

<template>
  <el-config-provider :value-on-clear="() => null" :empty-values="[undefined, null]">
    <div class="flex flex-wrap gap-4 items-center">
      <el-select v-model="value2" clearable placeholder="Select" style="width: 240px" >
        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
      </el-select>
      <el-select v-model="value1" clearable placeholder="Select" style="width: 240px" >
        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
      </el-select>
    </div>
  </el-config-provider>
</template>





<script lang="ts" setup>
import { ref } from "vue"
const value1 = ref<string | null>("")
const value2 = ref<string | undefined>("")
const options = [
  {
    value: "",
    label: "All",
  },
  {
    value: "Option1",
    label: "Option1",
  },
 
]
</script>