Vue(uniapp)父组件方法和子组件方法执行优先顺序

涉及到的知识点:watch监控:先看问题,父组件从后端通过$ajax获取数据,在将父组件将值传输给子组件,使用子组件使用created钩子函数获取数据,按自己的想法应该是父组件先获取后端数据,在传入给子组件,可是事实是,子组件先获取数据父组件在从后端获取数据这样的话子组件就没有数据获取为空

父页面:

<template><view class="approval-datails"><view class="information"> <!--申请信息--><uni-collapse ref="collapse" @change="change"><uni-collapse-item title="审批流程" title-border="show" :open="true"><uni-stepinformation :instanceApplyList='instanceApplyList'></uni-stepinformation></uni-collapse-item></uni-collapse></view></view>
</template><script>export default {data() {return {instanceApplyList:[],//传给子页面的数组}},methods: {getWaitingTask(){this.$ajax.getWaitingTask({id: this.id}, (response) => {if (response.success === true) {console.log('responseswaiting', response)this.result = response.resultthis.instanceApplyList = response.result.instanceApplyList// console.log('responseswaiting', this.result)console.log('this.instanceApplyList',this.instanceApplyList)}// this.listType(response)});},}}
</script>

子页面:

解决方法:将子页面中钩子函数created变成watch监听当父页面获取到后端数据时再调用type函数方法,这样就可以让父页面的函数先运行获取后端数据,在吧数据传入子页面,子页面获取数据在输出。

<template><view class="box"></view>
</template><script>export default {props:{instanceApplyList: Array,default:() => []},data() {return {judge:[],}},// created() {// 	this.type();// },watch:{instanceApplyList:{deep:true,handler(e){if(e.length>0){this.type()}}}},methods: {type(){this.judge=this.instanceApplyListconsole.log('this.judge',this.judge) }}}
</script>

运行结果:

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

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

相关文章

【机器学习合集】标准化与池化合集 ->(个人学习记录笔记)

文章目录 标准化与池化1. 标准化/归一化1.1 归一化归一化的作用 1.2 标准化批标准化方法 Batch Normailzation标准化方法的对比自动学习标准化方法 2. 池化2.1 池化的作用2.2 常见的池化方法2.3 池化方法的差异2.4 池化的必要性 标准化与池化 1. 标准化/归一化 1.1 归一化 归…

使用pycharm远程调试

使用pycharm 专业版&#xff0c; 在设置解释器中&#xff0c;具备ssh 解释器功能&#xff1b; 一般在本地无法调试远程端代码&#xff0c;机械性的scp传输文件十分影响工作效率&#xff0c;PyCharm的Pro支持远程Run&#xff0c;Debug&#xff0c;等可视化的功能。 操作系统&…

Git总结

Git介绍 一、Git常用命令 添加、提交 git add 将文件从工作区添加到暂存区&#xff0c;表示git开始追踪文件&#xff0c;如果不想让git追踪了&#xff0c;可以使用 git rm --cached <file> 取消文件追踪&#xff0c;仅仅只代表追踪取消&#xff0c;工作区文件还是照…

4.1 数据库安全性概述

思维导图&#xff1a; 前言&#xff1a; - **第一章回顾**&#xff1a;数据库特点 - 统一的数据保护功能&#xff0c;确保数据安全、可靠、正确有效。 - 数据保护主要涵盖&#xff1a; 1. **数据的安全性**&#xff08;本章焦点&#xff09; 2. 数据的完整性&#xff08;第…

pc与android设备进行通信

首先&#xff1a;根据此博客 Android模拟器调试TCP通讯_.emulator_console_auth_token-CSDN博客 思考&#xff1a; 只在本机电脑中&#xff1a; 服务器IP地址设为为0.0.0.0&#xff0c;并开始监听&#xff0c;客户端IP地址127.0.0.1&#xff0c;192.168.1.114都可连接。 12…

如何将数据库某列的值(如日期)作为表格的列名

如何将数据库某列的值&#xff08;如日期&#xff09;作为表格的列名 需求&#xff1a;前端需要展示如下的二维表格&#xff0c;其中表格的日期是数据库表里data的值&#xff0c;每行不同的值是表格里的字段值&#xff0c;也就是需要将表里的数据行转列&#xff0c;列转行&…

vue手动拖入和导入excel模版

1.列表按钮 <el-button click“importExcel(scope.row.id)” size“small” type“text”>导入excel模版 2.按钮弹框 3.data定义数据 data () { return { projectId: ‘’, importDialogVisible: false, fileList: [], //手动上传 upload_file: ‘’, //导入excel模版…

设计模式思维导图

ProcessOn思维导图链接

性能测试工具:如何学习JMeter?

JMeter是一个广泛应用于Web应用程序性能测试与负载测试的开源负载测试工具&#xff0c;学习JMeter则可以协助软件测试工程师更好地进行自动化性能测试与负载测试&#xff0c;本文就来介绍下如何学习JMeter。 1. 应用场景 (1) Web应用程序、数据库服务器、FTP服务器、SOAP和RE…

移动应用买量越来越难,APP增长的新机遇在哪里?

近两年来&#xff0c;“买量越来越难”是移动互联网每逢年末的固定趋势&#xff0c;“内卷”对于每一个互联网运营人来说成为了越来越普遍的存在。 比如在游戏买量领域&#xff0c;一家厂商做出一个素材之后&#xff0c;很多家都会陆续跟进。其次&#xff0c;素材的生命周期下…

[USACO2012-Mar-Silver] Flowerpot 题解(单调队列 c++)

[USACO12MAR] Flowerpot S题解(单调队列 c) 题目链接&#xff1a;[USACO2012-Mar-Silver] Flowerpot 题意&#xff1a; 给你n个点&#xff0c;每个点有对应的x,y确认是否存在两个点&#xff0c;在 y 1 , y 2 y_1,y_2 y1​,y2​满足要求的情况下&#xff0c;输出最小的 ∣ x …

uniapp vue2、vue3 页面模板代码块设置

本文分享 uniapp vue2、vue3 页面模板代码块设置 设置路径 HBuilder X -> 工具 -> 代码块设置 -> vue代码块 -> 自定义代码块 如上图操作后在打开的 vue.json 文件的右侧“自定义代码块”中复制如下代码&#xff08;可全选替换也可添加到代码中&#xff09; 示…

将CSDN或Confluence文章转为微信公众号格式

最近在更公众号文章&#xff0c;苦于排版和格式&#xff0c;就找了一个比较方便的方法&#xff0c;简单易用&#xff0c;排版也不错。 文章提取 有的文章是已经发布在其它平台了&#xff0c;比如CSDN或Confluence&#xff0c;可以使用飞书剪存方便的将文章提取出来&#xff0…

Android Studio模拟器/虚拟设备连接互联网的方法

如图&#xff0c;无线、网络都无法联网 找到本机的DNS 找到emu-launch-params.txt&#xff0c;添加DNS -dns-server 192.168.124.1 重启虚拟机&#xff0c;关闭无线

文件上传漏洞(3), 文件上传实战绕过思路, 进阶篇, 代码审计

文件上传漏洞实战思路(进阶) 一, 条件竞争(实战中很难成功) 需要代码审计 前端环境: 上传一张图片 后端源码: <?php $is_upload false; $msg null;if(isset($_POST[submit])){// 定义数组, 后缀名白名单$ext_arr array(jpg,png,gif);$file_name $_FILES[upload_f…

[AutoSAR系列] 1.3 AutoSar 架构

依AutoSAR及经验辛苦整理&#xff0c;原创保护&#xff0c;禁止转载。 专栏 《深入浅出AutoSAR》 1. 整体架构 ​ 图片来源&#xff1a; AutoSar 官网 从官往图中可以看出autosar作为汽车ECU软件架构&#xff0c;是通过分层来实现软硬件隔离。就像大多数操作系统一样&#xff…

网络安全—自学笔记

1.网络安全是什么 网络安全可以基于攻击和防御视角来分类&#xff0c;我们经常听到的 “红队”、“渗透测试” 等就是研究攻击技术&#xff0c;而“蓝队”、“安全运营”、“安全运维”则研究防御技术。 2.网络安全市场 一、是市场需求量高&#xff1b; 二、则是发展相对成熟…

Spring Boot中RedisTemplate的使用

当前Spring Boot的版本为2.7.6&#xff0c;在使用RedisTemplate之前我们需要在pom.xml中引入下述依赖&#xff1a; <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-data-redis</artifactId><vers…

基于SSM的幼儿园管理系统

基于SSM的幼儿园管理系统的设计与实现~ 开发语言&#xff1a;Java数据库&#xff1a;MySQL技术&#xff1a;SpringSpringMVCMyBatis工具&#xff1a;IDEA/Ecilpse、Navicat、Maven 系统展示 登录界面 管理员界面 摘要 基于SSM&#xff08;Spring、Spring MVC、MyBatis&#…

SuperHF: Supervised Iterative Learning from Human Feedback

本文是LLM系列文章&#xff0c;针对《SuperHF: Supervised Iterative Learning from Human Feedback》的翻译。 SuperHF&#xff1a;从人的反馈中监督迭代学习 摘要1 引言2 相关工作3 背景4 方法5 实验6 讨论与未来工作7 结论 摘要 人工智能领域越来越关注大规模语言模型&…