Vue3中父组件与子组件的传值

子组件:SelectCity

javascript 复制代码
const emit = defineEmits(['sendCity'])
//每个按钮的触发事件
const doSomething=(city)=>{
  console.log("子组件中"+city);
  emit("sendCity",city)
}

它通过 emit 发出 sendCity 事件,将 city 作为数据传递给父组件或其他监听了该事件的组件

父组件:air

直接监听sendCity事件,

html 复制代码
 <SelectCity  @sendCity="handleSendCity"></SelectCity>

监听到了触发handleSendCity函数

javascript 复制代码
function handleSendCity(city) {
  // 在这里处理接收到的城市信息
  console.log('父组件中监听到的城市', city);
  // 可以在这里进行其他逻辑处理
}
相关推荐
GGGG寄了8 分钟前
HTML——列表标签
前端·html5
HWL567917 分钟前
显示器缩放和更改分辨率的区别
前端·css·vue.js·计算机外设·html5
jzshmyt25 分钟前
曼德勃罗集web可视化应用
前端
GGGG寄了27 分钟前
HTML——表格的基本用法
前端·html
yanyu-yaya1 小时前
速学兼复习之vue3章节3
前端·javascript·vue.js·学习·前端框架
web小白成长日记1 小时前
前端向架构突围系列模块化 [4 - 1]:思想-超越文件拆分的边界思维
前端·架构
tkevinjd1 小时前
3-Vue&Ajax
前端·vue.js·ajax
林恒smileZAZ1 小时前
前端拖拽,看似简单,其实处处是坑
前端·javascript·vue.js
多仔ヾ1 小时前
Vue.js 前端开发实战之 03-Vue 开发基础(2)
vue.js
Filotimo_1 小时前
那在HTML中,action是什么
前端·okhttp·html