v-model双向绑定组件通信

ops/2024/10/19 11:39:20/

给input元素绑定原生input事件,触发input事件时,进而触发update:model-value事件

<template>
<Child v-model="lastName" v-if="true"></Child>
<p >{{lastName}}</p>
</template>
<script>
import Child from "./components/child.vue"
data() {return {lastName: '我是父组件'};},
</script>

子组件

<template><div>我是child组件<!-- <input type="text" :value="lastName" @input="$emit('update', $event.target.value)"> --><input type="text" v-model="input"></div>
</template>
<script>
export default {name: 'Child',props: ['lastName'],model:{prop: 'lastName',event: 'update'},data() {return {// value: this.lastName,}},computed: {input: {get() {return this.lastName;},set(val) {this.$emit('update', val);    // 触发}}},mounted() {},methods: {},}
</script>

http://www.ppmy.cn/ops/126710.html

相关文章

STM32_实验3_控制RGB灯

HAL_Delay 是 STM32 HAL 库中的一个函数&#xff0c;用于在程序中产生一个指定时间的延迟。这个函数是基于系统滴答定时器&#xff08;SysTick&#xff09;来实现的&#xff0c;因此可以实现毫秒级的延迟。 void HAL_Delay(uint32_t Delay); 配置引脚&#xff1a; 点击 1 到 IO…

rootless模式下istio ambient鉴权策略

环境说明 rootless模式下测试istio Ambient功能 四层鉴权策略 这里四层指的是网络通信模型的第四层&#xff0c;主要的传输协议为TCP和UDP。 用于限制服务间的通信&#xff0c;比如下面的策略应用于带有 app: productpage 标签的 Pod&#xff0c; 并且仅允许来自服务帐户 clus…

【MySQL】MySQL的简单了解详解SQL分类数据库的操纵方法

一、mysql定义 mysql是数据库服务的客户端&#xff0c;mysqld是数据库服务的服务器端。mysql的本质就是基于CS模式下的一种网络服务。数据库一般指的是在磁盘中或内存中存储的特定结构组织的数据&#xff0c;将来就是在磁盘上存储的一套数据库方案。 创建数据库&#xff0c;本质…

Rust编写硬件抽象层(HAL)服务

基于Rust编写硬件抽象层&#xff08;HAL&#xff09;服务是一个复杂但有趣的任务&#xff0c;它涉及到嵌入式系统开发的多个方面。以下是一个详细的指南&#xff0c;帮助你理解如何使用Rust编写HAL服务。 一、引言 硬件抽象层&#xff08;HAL&#xff09;是嵌入式系统开发中的…

校车购票微信小程序的设计与实现(lw+演示+源码+运行)

摘 要 由于APP软件在开发以及运营上面所需成本较高&#xff0c;而用户手机需要安装各种APP软件&#xff0c;因此占用用户过多的手机存储空间&#xff0c;导致用户手机运行缓慢&#xff0c;体验度比较差&#xff0c;进而导致用户会卸载非必要的APP&#xff0c;倒逼管理者必须改…

Redis Search系列 - 第一讲 创建索引

目录 一、引言二、全文检索基本概念三、创建索引 一、引言 Redis Search 是 Redis 的一个模块&#xff0c;用于提供全文搜索和二级索引功能。它允许在 Redis 数据库中执行复杂的搜索查询&#xff0c;并支持多种数据类型和查询操作。以下是 Redis Search 的一些关键特性&#x…

Leetcode 分割等和子集

这段代码的目的是解决 LeetCode 416 问题&#xff1a;分割等和子集&#xff0c;即判断一个只包含正整数的数组&#xff0c;是否能够将其分割成两个子集&#xff0c;使得这两个子集的元素和相等。 算法思想&#xff08;动态规划 - 背包问题&#xff09; 该问题本质上是一个经典…

基于ESP32的便携式游戏机

基于ESP32的便携式游戏机 一、项目说明二、项目材料三、程序测试四、设置LCD屏幕五、控制设置六、测试电路七、外壳制作八、结果 视频&#xff1a; ESP32 pro 一、项目说明 欢迎来到复古游戏的世界&#xff01;你是否曾经想要以便携格式重温童年的经典游戏&#xff1f;在这个…