指尖上的记忆指尖上的记忆
首页
  • 基础
  • Laravel框架
  • Symfony框架
  • 基础
  • Gin框架
  • 基础
  • Spring框架
  • 命令
  • Nginx
  • Ai
  • Deploy
  • Docker
  • K8s
  • Micro
  • RabbitMQ
  • Mysql
  • PostgreSsql
  • Redis
  • MongoDb
  • Html
  • Js
  • 前端
  • 后端
  • Git
  • 知识扫盲
  • Golang
🌟 gitHub
首页
  • 基础
  • Laravel框架
  • Symfony框架
  • 基础
  • Gin框架
  • 基础
  • Spring框架
  • 命令
  • Nginx
  • Ai
  • Deploy
  • Docker
  • K8s
  • Micro
  • RabbitMQ
  • Mysql
  • PostgreSsql
  • Redis
  • MongoDb
  • Html
  • Js
  • 前端
  • 后端
  • Git
  • 知识扫盲
  • Golang
🌟 gitHub

vue3之modelValue更新事件:

1>传递参数(原生写法)
<template>
  <MyComponent v-model="modelValue" @update:model-value="(value) => onValueChange(ticket.id, value)" />
</template>
  
2>传递参数(简洁写法)
<template>
  <MyComponent v-model="modelValue" @update:model-value="onValueChange(ticket.id, $event)" />
</template>
  
3>如果没有自定义参数可以直接传递 $event 或者 什么参数也不传递,默认就是 $event, 在onValueChange 方法中直接可以获取
<template>
  <MyComponent v-model="modelValue" @update:model-value="onValueChange($event)" />
</template>
或
<template>
  <MyComponent v-model="modelValue" @update:model-value="onValueChange" />
</template>
  
对应方法:
<script setup>
const onSectionCheckboxChanged = (id: number, value: boolean) => {
  console.log("section is:", id);
  console.log("section checked:", value)
};
</script>
  
<script setup>
const onSectionCheckboxChanged = (value: boolean) => {
  console.log("section is:", id);
  console.log("section checked:", value)
};
</script>