28 组合事件配合 v-modle 使用
子级元素发生改变,父级元素及时做出相应的响应
1.首先回顾 v-modle, 表单的语句,实时或者延时(.lazy)获得用户输入的信息
2. 侦听器 watch ,实时响应然后做出相关操作
<h3>响应组件</h3>
<Search @Search="myAnser" />
响应:{{ anser }}
</template>
<script>
import Search from './Search.vue';
export default {
data() {
return {
anser: ""
}
},
methods: {
myAnser(search) {
this.anser = search
}
},
components: {
Search,
},
}
</script>
<template>
搜索:
<input type="text" v-model="search">
<br>
</template>
<script>
export default{
data() {
return {
search: ""
}
},
watch: {
search(newValue, oldValue) {
this.$emit("Search",newValue)
}
},
}
</script>
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· 三行代码完成国际化适配,妙~啊~
· .NET Core 中如何实现缓存的预热?