当前位置: 首页 > news >正文

uniapp中父组件传参到子组件页面渲染不生效问题处理实战记录

    上篇文件介绍了,父组件数据更新正常但是页面渲染不生效的问题,详情可以看下:uniapp中父组件数组更新后与页面渲染数组不一致实战记录
    本文在此基础上由于新增需求衍生出新的问题.本文只记录一下解决思路.
    下面说下新增需求方便理解场景:
商品信息设置中添加抽奖概率设置,默认概率相同,页面如下:在这里插入图片描述
    可以切换成自定义.显示概率输入框,页面如下:
在这里插入图片描述

    处理逻辑中给goodsList的每个详情中根据业务场景添加了对应属性:

"sameRate": 1, // 1.概率相同;2.自定义
"prizeRate": 0,  // sameRate为2时有效

    子组件中sameRate为1显示相同,sameRate为2时显示概率输入框.
    出现问题:
    显示设置radio切换逻辑中添加了goodsList中每个对象属性sameRate进行变更的处理逻辑.控制台发现goodsList数据变化显示正常.goodsList中每个对象属性sameRate会随着显示设置切换正常变化,统一为1或是统一为2.但是子组件显示的三个商品信息概率一栏中只会显示相同(sameRate为1),无法跟随显示设置动态变化.
    问题原因:
    这里涉及到父页面数据变换后如何让子组件重新渲染的问题,一般来讲父组件中数据变换通过props传递到子组件进行重新渲染.我这边出现问题的原因是子组件采用了自定义key.页面初始化后已经是固定值.vue中默认子组件中唯一key变化后才会重新渲染子组件.所以处理办法是在radio切换逻辑中变更goodsList中每个对象属性的key值.

相关文章:

uniapp中父组件传参到子组件页面渲染不生效问题处理实战记录

上篇文件介绍了,父组件数据更新正常但是页面渲染不生效的问题,详情可以看下:uniapp中父组件数组更新后与页面渲染数组不一致实战记录 本文在此基础上由于新增需求衍生出新的问题.本文只记录一下解决思路. 下面说下新增需求方便理解场景: 商品信息设置中添加抽奖概率设置…...

螺丝螺帽缺陷检测识别数据集,支持yolo,coco,voc三种格式的标记,一共3081张图片

螺丝螺帽缺陷检测识别数据集,支持yolo,coco,voc三种格式的标记,一共3081张图片 3081总图像数 数据集分割 训练组90% 2781图片 有效集7% 220图片 测试集3% 80图片 预处理…...

一个简单带颜色的Map

越简单 越实用。越少设计,越易懂。 需求背景: 创建方法,声明一个hashset, 元素为 {“#DE3200”, “#FA8C00”, “#027B00”, “#27B600”, “#5EB600”} 。 对应的key为 key1 、key2、key3、key4、key5。 封装该方法&#xff0c…...

kubeadm安装K8s集群之基础环境配置

系列文章目录 1.kubeadm安装K8s集群之基础环境配置 2.kubeadm安装K8s集群之高可用组件keepalivednginx 3.kubeadm安装K8s集群之master节点加入 4.kubeadm安装K8s集群之worker1节点加入 kubeadm安装K8s集群基础环境配置 1.首先确保所有机器可以通信,然后配置主机host…...

前端实现在线预览excel文件

在前端开发中,经常会遇到需要在线预览各种文件的需求。本文将介绍如何使用前端技术实现在线预览 Excel 文件的功能。 一、基于微软office服务的excel预览 获取要预览的 Excel 文件的 URL(例如存储在 OneDrive 或 SharePoint 上的文件)。 使…...

关于idea-Java-servlet-Tomcat-Web开发中出现404NOT FOUND问题的解决

在做web项目时,第一次使用servlet开发链接前端和后端的操作,果不其然,遇到了诸多问题,而遇到最多的就是运行项目打开页面时出现404NOT FOUND的情况。因为这个问题我也是鼓捣了好久,上网查了许多资料才最终解决&#xf…...

SCRM私域流量管理工具助力企业微信电商转型升级

内容概要 在当今数字化时代,SCRM(社交客户关系管理)私域流量管理工具正逐渐成为企业转型的重要助力。尤其是在电商领域,企业微信的兴起为许多公司打开了新的销售渠道,通过SCRM系统的高效整合,企业能够更加…...

三相异步电动机为什么能够旋转?

三相异步电动机,作为一种广泛应用于工业、农业及其他领域的电动机,其工作原理的理解对于工程技术人员以及相关从业者来说至关重要。 一、三相异步电动机的基本结构 三相异步电动机主要由定子、转子和机壳组成。定子是电动机的静止部分,包含…...

优化移动端H5:常见问题与解决方案

移动端H5开发中的“坑”与解决方案 本文介绍了开发中遇到的几个关于移动端H5开发中的小问题,以及解决的方法。 一、iOS滑动不流畅问题 在iOS设备上,H5页面的滑动效果有时会出现不流畅的情况,特别是在页面高度超过一屏时。这通常是由于iOS的…...

TM1不藏私系列——#10. TM1快速运算的秘密武器-Feeder

与其他BI产品对比,TM1的快速运算能力一骑绝尘。 但是在多维度的数据组合下,TM1是依据什么进行运算的呢? 今天将和大家一同了解TM1快速运算的秘密武器-Feeder。 上期我们提到通过配置维度中的元素权重,可以在合并层级加总计算。除…...

【Python】【Conda 】Conda vs venv:Python开发者的虚拟环境选择指南

目录 引言一、概述1.1 Conda 虚拟环境1.2 Python venv 虚拟环境 二、安装与设置2.1 安装 Conda 虚拟环境2.2 安装 Python venv 虚拟环境 三、依赖管理3.1 Conda 依赖管理3.2 Python venv 依赖管理 四、适用场景五、性能与资源占用5.1 Conda 性能与资源占用5.2 Python venv 性能…...

【从0学英语】06.时态 - 一般过去时

一般过去时(Past Simple Tense)是表达过去发生的动作、状态或事实的核心时态。这一时态都扮演着不可或缺的角色,本篇文章将全面讲解一般过去时的定义、结构、用法以及常见的动词变化,通过例句和详细的解释帮你理解这一时态。 文章…...

获取cpu序列号-python实现

DataBall 助力快速掌握数据集的信息和使用方式,会员享有 百种数据集,持续增加中。 需要更多数据资源和技术解决方案,知识星球: “DataBall - X 数据球(free)” -------------------------------------------------------------…...

文献分享: PLAID——为ColBERT架构设计的后期交互驱动器

👉前情提要: 神经网络自然语言模型概述 Transformer \text{Transformer} Transformer与注意力机制概述 📚相关论文: BERT: Pre-training of Deep Bidirectional Transformers for Language Understanding \text{BERT: Pre-train…...

IMX6ULL开发板、PC机上的USB网卡、VMware中的Ubuntu的桥接网卡三者互Ping设置及设置

连上PC机上的USB网卡配置 首先打开Windows设备管理器,截图记录下当前的网络适配器,作为插上USB网卡后的对比: 然后打开“更改适配器选项”,也截张图,作为插上USB网卡后的对比: 插上USB网口&#xff0…...

孚盟云 MailAjax.ashx SQL漏洞复现

0x01 产品描述: ‌孚盟云‌是由...

前端 mp4 视频改成 m3u8 流模式

前端 mp4 视频改成 m3u8 流模式 mp4 视频的问题 1、mp4 视频通常对应一个文件,播放时需要加载全部文件,消耗网络资源。如果用户从中间某个时间访问,也会从头开始下载,浪费服务器性能。 2、mp4 视频文件容易被用户下载到本地。有…...

聚焦港口智能接处警,开启平安海运之门

一、概述 港口作为海运的关键枢纽,安全保障至关重要。港口智能接处警系统凭借智能化、数字化、信息化手段,融合 AI 与大数据等前沿技术,旨在实现对港口各类警情的快速、精准处理,有效提升港口应急响应能力,开启平安海…...

`yarn list --pattern element-ui` 是一个 Yarn 命令,用于列出项目中符合指定模式(`element-ui`)的依赖包信息

文章目录 命令解析:功能说明:示例输出:使用场景: yarn list --pattern element-ui 是一个 Yarn 命令,用于列出项目中符合指定模式( element-ui)的依赖包信息。 命令解析: yarn list…...

ElementEye,网页分析器

介绍 我们经常使用Python写爬虫,爬到网页数据之后,就需要用beautifulSoup进行解析。因为写爬虫并不是我的主营工作,大多数只是用来分析一下想要的数据而已,所以经常会忘记beautifulSoup的用法。 同时,我们总是分析页面…...

uniapp 对接腾讯云IM群组成员管理(增删改查)

UniApp 实战:腾讯云IM群组成员管理(增删改查) 一、前言 在社交类App开发中,群组成员管理是核心功能之一。本文将基于UniApp框架,结合腾讯云IM SDK,详细讲解如何实现群组成员的增删改查全流程。 权限校验…...

iOS 26 携众系统重磅更新,但“苹果智能”仍与国行无缘

美国西海岸的夏天,再次被苹果点燃。一年一度的全球开发者大会 WWDC25 如期而至,这不仅是开发者的盛宴,更是全球数亿苹果用户翘首以盼的科技春晚。今年,苹果依旧为我们带来了全家桶式的系统更新,包括 iOS 26、iPadOS 26…...

Qt Widget类解析与代码注释

#include "widget.h" #include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget) {ui->setupUi(this); }Widget::~Widget() {delete ui; }//解释这串代码,写上注释 当然可以!这段代码是 Qt …...

【第二十一章 SDIO接口(SDIO)】

第二十一章 SDIO接口 目录 第二十一章 SDIO接口(SDIO) 1 SDIO 主要功能 2 SDIO 总线拓扑 3 SDIO 功能描述 3.1 SDIO 适配器 3.2 SDIOAHB 接口 4 卡功能描述 4.1 卡识别模式 4.2 卡复位 4.3 操作电压范围确认 4.4 卡识别过程 4.5 写数据块 4.6 读数据块 4.7 数据流…...

蓝桥杯 2024 15届国赛 A组 儿童节快乐

P10576 [蓝桥杯 2024 国 A] 儿童节快乐 题目描述 五彩斑斓的气球在蓝天下悠然飘荡,轻快的音乐在耳边持续回荡,小朋友们手牵着手一同畅快欢笑。在这样一片安乐祥和的氛围下,六一来了。 今天是六一儿童节,小蓝老师为了让大家在节…...

视频字幕质量评估的大规模细粒度基准

大家读完觉得有帮助记得关注和点赞!!! 摘要 视频字幕在文本到视频生成任务中起着至关重要的作用,因为它们的质量直接影响所生成视频的语义连贯性和视觉保真度。尽管大型视觉-语言模型(VLMs)在字幕生成方面…...

C# 类和继承(抽象类)

抽象类 抽象类是指设计为被继承的类。抽象类只能被用作其他类的基类。 不能创建抽象类的实例。抽象类使用abstract修饰符声明。 抽象类可以包含抽象成员或普通的非抽象成员。抽象类的成员可以是抽象成员和普通带 实现的成员的任意组合。抽象类自己可以派生自另一个抽象类。例…...

Aspose.PDF 限制绕过方案:Java 字节码技术实战分享(仅供学习)

Aspose.PDF 限制绕过方案:Java 字节码技术实战分享(仅供学习) 一、Aspose.PDF 简介二、说明(⚠️仅供学习与研究使用)三、技术流程总览四、准备工作1. 下载 Jar 包2. Maven 项目依赖配置 五、字节码修改实现代码&#…...

LLMs 系列实操科普(1)

写在前面: 本期内容我们继续 Andrej Karpathy 的《How I use LLMs》讲座内容,原视频时长 ~130 分钟,以实操演示主流的一些 LLMs 的使用,由于涉及到实操,实际上并不适合以文字整理,但还是决定尽量整理一份笔…...

mac:大模型系列测试

0 MAC 前几天经过学生优惠以及国补17K入手了mac studio,然后这两天亲自测试其模型行运用能力如何,是否支持微调、推理速度等能力。下面进入正文。 1 mac 与 unsloth 按照下面的进行安装以及测试,是可以跑通文章里面的代码。训练速度也是很快的。 注意…...