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);
  // 可以在这里进行其他逻辑处理
}
相关推荐
tERS ERTS7 小时前
头歌答案--爬虫实战
java·前端·爬虫
当时只道寻常7 小时前
Vue3 集成 NProgress 进度条:从入门到精通
前端·vue.js
kyriewen7 小时前
React性能优化:从“卡成狗”到“丝般顺滑”的5个秘诀
前端·react.js·性能优化
米丘7 小时前
Vue 3.x 单文件组件(SFC)模板编译过程解析
前端·vue.js·编译原理
helloweilei7 小时前
Web Streams 简介
前端·javascript
悟空瞎说7 小时前
Flutter热更新 Shorebird CodePush 原理、实现细节及费用说明
前端·flutter
didadida2627 小时前
从“不存在”的重复请求,聊到 Web 存储的深坑
前端
xiaominlaopodaren7 小时前
Three.js 渲染原理-透明渲染为什么这么难
前端
米丘7 小时前
vue3.x 内置指令有哪些?
前端·vue.js