Vue:【亲测可用】父组件数组包对象,传给子组件对象,子组件修改属性(字段)后,父组件没有更新

news2024/11/20 6:33:29

场景:vue中父组件数组包对象,传给子组件对象,子组件修改属性(字段)后,父组件没有更新

代码:

# 父组件
<div v-for="(object, name, index) in arr" :key="index">
  <子组件 v-model="object" />
</div>

假设:object={age:80, name: '张三'}

子组件修改 age属性值为 20,此时父组件是不会改变的,重启项目有可能还会报一下错误

You are binding v-model directly to a v-for iteration alias. This will not be able to modify the v-for source array because writing to the alias is like modifying a function local variable. Consider using an array of objects and use v-model on an object

解决如下:

# 父组件
<div v-for="(object, name, index) in arr" :key="index">
  <子组件 v-model="arr[index]" />
</div>

解析:区别在于 v-model="object"  变成了 v-model="arr[index]" 

完~

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1475467.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

autocrlf和safecrlf

git远程拉取及提交代码&#xff0c;windows和linux平台换行符转换问题&#xff0c;用以下两行命令进行配置&#xff1a; git config --global core.autocrlf false git config --global core.safecrlf true CRLF是windows平台下的换行符&#xff0c;LF是linux平台下的换行符。…

jvm常用参数配置

一、 常用参数 -Xms JVM启动时申请的初始Heap值&#xff0c;默认为操作系统物理内存的1/64但小于1G。默认当空余堆内存大于70%时&#xff0c;JVM会减小heap的大小到-Xms指定的大小&#xff0c;可通过-XX:MaxHeapFreeRation来指定这个比列。Server端JVM最好将-Xms和-Xmx设为相同…

LVGL 环境搭建-基于WSL

背景说明 小白刚开始接触LVGL&#xff0c;前些日子狠心花198元入手了一块堪称LVGL 入门利器~HMI-Board 开发板&#xff0c;虽然有RT-Thread 集成好的LVGL 环境&#xff0c;只需要几个步骤就能成功把lvgl 的示例运行起来&#xff0c;对于爱折腾的我来说&#xff0c;过于简单也并…

Nginx高级技巧:实现负载均衡和反向代理

文章目录 Nginx概述Nginx作用正向代理反向代理负载均衡动静分离 Nginx的安装 -->Docker3.1 安装Nginx3.2 Nginx的配置文件3.3 修改docker-compose文件 Nginx源码安装nginx常用命令nginx配置文件配置文件位置配置文件结构详情 Nginx的反向代理【重点】基于Nginx实现反向代理4…

pandas两列或多列全组合

现有星期、国家、标签三类数据&#xff0c;希望得到全部组合&#xff0c;实现方式如下&#xff1a; #星期和国家全组合 a1pd.DataFrame(indexrange(7),columns[星期],datanp.arange(0,7)) b1pd.DataFrame(data[美国,新加坡],columns[国家]) c1pd.DataFrame(data[a,b],columns[…

数据结构:栈和队列与栈实现队列(C语言版)

目录 前言 1.栈 1.1 栈的概念及结构 1.2 栈的底层数据结构选择 1.2 数据结构设计代码&#xff08;栈的实现&#xff09; 1.3 接口函数实现代码 &#xff08;1&#xff09;初始化栈 &#xff08;2&#xff09;销毁栈 &#xff08;3&#xff09;压栈 &#xff08;4&…

【软件测试】--功能测试4-html介绍

1.1 前端三大核心 html:超文本标记语言&#xff0c;由一套标记标签组成 标签&#xff1a; 单标签&#xff1a;<标签名 /> 双标签:<标签名></标签名> 属性&#xff1a;描述某一特征 示例:<a 属性名"属性值"> 1.2 html骨架标签 <!DOC…

备考2025年考研数学二:2015-2024年考研数学真题•填空题练一练

这几天考研初试分数线陆续出来了&#xff0c;似乎竞争更激烈了。明年要顺利进入心目中的大学和专业&#xff0c;必须加倍努力&#xff0c;锁定胜局。 今天继续分享2015年-2024年的考研数学二填空题&#xff0c;随机做5道真题&#xff0c;并提供解析。看看正在备考2025年考研的…

为什么会造成服务器丢包?

随着云服务器市场的发展和网络安全问题&#xff0c;服务器丢包问题成为了一个普遍存在的现象。服务器丢包是指在网络传输过程中&#xff0c;数据包由于各种原因未能到达目标服务器&#xff0c;导致数据传输中断或延迟。那么&#xff0c;为什么会造成服务器丢包呢&#xff1f;下…

基于Camunda实现bpmn2.0各种类型监听器Listeners

基于Camunda实现bpmn2.0各种类型监听器Listeners ​ 监听器是在 BPMN 2.0 规范基础上扩展的功能&#xff0c;能扩展业务功能与流程的联系。 可以通过配置监听器的方式和各种动作。 ​ 监听器在生产中通常会用在几个方面&#xff1a; 动态分配节点受理人&#xff0c;通过前一…

Django项目使用vue打包前端页面使用教程

一、vue打包&#xff1a; 一般使用 npm run build 进行打包&#xff0c;打包完成后会生成一个dist文件夹 二、修改vue.config.js配置 vue.config..js配置里面增加&#xff1a; assetsDir: static 三、修改Django项目 将Django的static文件夹删除&#xff0c;移动di…

工业RTU串口网关有哪些使用用途和使用场景

工业RTU串口网关有哪些使用用途和使用场景 搜索蓝蜂物联网官网&#xff0c;即可免费领取样机使用&#xff01;&#xff01;先到先得&#xff01;&#xff01;&#xff01; 工业RTU串口网关在工业自动化领域中发挥着重要作用&#xff0c;其主要用途包括数据采集、协议转换、远…

Openstack云计算架构及前期服务搭建

openstack介绍 Openstack是一个开源的云计算管理平台项目&#xff0c;由几个主要的组件组合起来完成具体工作&#xff0c;支持几乎所有的云环境&#xff0c;项目目标是提供实施简单、可大规模扩展、丰富、标准统一的云计算管理平台 ----百度百科 Openstack是一个云操作系统&a…

Leetcoder Day28| 贪心算法part02

122.买卖股票的最佳时机 II 给定一个数组&#xff0c;它的第 i 个元素是一支给定股票第 i 天的价格。 设计一个算法来计算你所能获取的最大利润。你可以尽可能地完成更多的交易&#xff08;多次买卖一支股票&#xff09;。 注意&#xff1a;你不能同时参与多笔交易&#xff08…

逆向案例一:AES解密基于数位观察城市数据

import requests import json from Crypto.Cipher import AES # 开始解密 from Crypto.Util.Padding import unpad #去填充的逻辑 import base64 url https://app.swguancha.com/client/v1/cPublic/consumer/baseInfo data {current: 1,"dimensionTime": "20…

C# 学习第四弹——字符串

一、char类型的使用 字符使用单引号&#xff0c;单个字符 转义字符是一种特殊的字符变量&#xff0c;以反斜线开头&#xff0c;后跟一个或多个字符。 输出多级目录可以使用 二、字符串的声明和初始化 1、引用字符串常量 引用字符串常量初始化——字符使用单引号&#xff0…

阿里云A10推理qwen

硬件配置 vCPU&#xff1a;32核 内存&#xff1a;188 GiB 宽带&#xff1a;5 Mbps GPU&#xff1a;NVIDIA A10 24Gcuda 安装 wget https://developer.download.nvidia.com/compute/cuda/12.1.0/local_installers/cuda-repo-rhel7-12-1-local-12.1.0_530.30.02-1.x86_64.rpm s…

用Java语言创建的Spring Boot项目中,如何传递List集合呢?

前言&#xff1a; 在上篇文章中&#xff0c;用Java语言创建的Spring Boot项目中&#xff0c;如何传递数组呢&#xff1f;&#xff1f;-CSDN博客&#xff0c;我们了解到Spring Boot项目中如何传递数组&#xff0c;但是&#xff0c;对于同类型的List集合&#xff0c;我们又该如何…

智能驾驶规划控制理论学习01-自动驾驶系统介绍、规划控制模块介绍

目录 一、自动驾驶系统概述 二、规划控制模块介绍 1、规划控制架构 2、规划控制目标 3、Cartesian和Frenet坐标系 4、Frenet坐标系概览 5、解耦式规划和联合式规划 一、自动驾驶系统概述 目前被国内外广为接受的自动驾驶级别划分标准是 SAE&#xff…

Java Web(八)--Servlet(二)

Servlet API Servlet API 包含以下4个Java包&#xff1a; 1. javax.servlet&#xff1a;其中包含定义Servlet和Servlet容器之间契约的类和接口。 2. javax.servlet.http&#xff1a;主要定义了与HTTP协议相关的HttpServlet类&#xff0c;HttpServletRequest接口和HttpServl…