Vue3 el-switch @change事件在初始化时会自动调用问题

接收一个vue3项目,突然有一天,table里有个switch开关,请求数据之后就开始执行switch的change事件,我还啥都没操作,就报一推重复请求

javascript 复制代码
<template>
  <el-switch v-model="rec" inline-prompt :active-value="0" :inactive-value="1"
    active-text="是" inactive-text="否"  @change="switchChange(rec)"/>
</template>
<script setup>
import {ref} from 'vue'
const rec = ref(null)
const switchChange = (re)=> {
    console.log('执行',re)
}
</script>

去网上找了一大推,都说用before-change代替change

后来又去看了其他页面的写法,没有调用
对比了代码发现只要v-model给的初始值跟active-value和inactive-value类型和数据不一致就会调用

const rec = ref(0)修改成这样就不会初始化就执行

修改成一致都没问题,找到问题了又去试了下好了,原来是后端偷偷又把数据改回来了

相关推荐
用户938515635075 小时前
React 受控/非受控组件与 React.memo 性能优化——从本质到实战
前端·javascript·react.js
IT_陈寒5 小时前
Java并行流把我坑惨了:原来不是线程安全的!
前端·人工智能·后端
计科土狗6 小时前
GESP六级专题之类与对象
java·前端·数据库
anOnion6 小时前
构建无障碍组件之Listbox Pattern
前端·html·交互设计
凌涘6 小时前
前端路由(三):鉴权、拦截与重定向
前端
其美杰布-富贵-李6 小时前
第 8 篇:Three.js 材质系统
javascript·three.js·js
To_OC6 小时前
LC 3 无重复字符的最长子串:从入门滑动窗口到优化写法,再也不怕面试官追问
javascript·算法·leetcode
半个落月6 小时前
从零梳理 React Router:路由、懒加载、嵌套页面与登录鉴权
前端·react.js
tedcloud1237 小时前
Impeccable 部署指南:开源前端设计工具 Linux 环境搭建实践
linux·运维·服务器·前端·人工智能·开源
默_笙7 小时前
🚩 React + TypeScript 的 Props 通信,我从"把事件对象传给父组件"进化到了"只传值"
前端·javascript