【2025.3.2】突然vue代码一片红，Vue - Official 插件2.2.6慎更新。。。

leafnote
5,096 阅读2分钟

Snipaste_2025-03-02_10-10-10.png\

前言

昨晚打开项目，突然代码里一片红，先是以为elment-plus的问题，装了以前的版本，并没有用。。。
后来像可能是vue或typscript的问题，也尝试了以前的版本，也没有用。。。
今天早上突然想到可能是Vue-Official插件的问题，结果安装旧版一试，满屏的红色就消失了！！！

报错的代码

来自Switch 开关 | Element Plus

<template>
    <el-switch v-model="value1" />
    <el-switch
      v-model="value2"
      class="ml-2"
      style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
    />
  </template>
  
  <script lang="ts" setup>
  import { ref } from 'vue'
  
  const value1 = ref(true)
  const value2 = ref(true)
  </script>

尝试解决新版下的报错

在最新版的插件下要怎么解决报错呢？ 要这么定义

 const value1 = ref<string|boolean|number>(true)

Snipaste_2025-03-02_10-11-45.png

总结

新版似乎对v-model类型要求更严格了。 对于 v-model="value"
之前版本: value的类型只要是子组件定义时的类型之一就可以
新版版：value的类型必须和定义的类型完全一致
个人感觉类型要求严格是合理的，但不知会不会有与之配合的新写法，否则以后要写得更麻烦了。。
业务数据类型要完全匹配组件类型，感觉类型更乱了。。。

支持一下

期待至少一个项目能达成1000个star 期待至少一个npm能达成每周1000次下载

avatar
文章
阅读
粉丝