FRONT01_三元表达式+refs调用子组件时的undefined

2024-05-02 01:32

本文主要是介绍FRONT01_三元表达式+refs调用子组件时的undefined,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

①. vue 三元表达式及类似用法

    <div id="app"><span :style="{'color':status === true ? '#FF5757':'#757575'}">测试</span><div>===========</div><div>{{age==24?'tangzhi':age==23?'yangxing':'yangyang'}}</div><div>===========</div><!-- 使用一个函数去处理 --><span> {{ listType(3)}} </span></div><script src="../js/vue.js"></script><script>var vm=new Vue({el:'#app',data:{   //格式:<:style="{'属性名':三元表达式}"> status:false,age:24},methods:{//如果有多列,使用一个函数来处理listType(type){switch(type){case 1:return '支援申请书';break;case 2:return '事故车照片';break;case 3:return '定损协议';break;case 4:return '结算单';break;case 5:return '维修定损发票';break;default:return '未知';}}}});</script>

在这里插入图片描述
在这里插入图片描述

②. 当element-ui的el-dialog组件中包含子组件时

  • ①. 问题呈现:我在一个el-dialog组件中包含子组件时,使用$refs失效
    (element-ui的el-dialog组件中包含了一个子组件)
	 this.showAccidentFilePage=true;//打开上传文件弹出层vue.nextTick(()=>{this.$refs.accidentFilePageRef.reloadFilePage(params)})
  • ②. 解决办法:
	this.showAccidentFilePage=true;//打开上传文件弹出层setTimeout(()=>{this.$refs.accidentFilePageRef.reloadFilePage(params)},0)

这篇关于FRONT01_三元表达式+refs调用子组件时的undefined的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/953123

相关文章

在C#中调用Python代码的两种实现方式

《在C#中调用Python代码的两种实现方式》:本文主要介绍在C#中调用Python代码的两种实现方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录C#调用python代码的方式1. 使用 Python.NET2. 使用外部进程调用 Python 脚本总结C#调

Vue中组件之间传值的六种方式(完整版)

《Vue中组件之间传值的六种方式(完整版)》组件是vue.js最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的数据无法相互引用,针对不同的使用场景,如何选择行之有效的通信方式... 目录前言方法一、props/$emit1.父组件向子组件传值2.子组件向父组件传值(通过事件形式)方

SpringCloud之LoadBalancer负载均衡服务调用过程

《SpringCloud之LoadBalancer负载均衡服务调用过程》:本文主要介绍SpringCloud之LoadBalancer负载均衡服务调用过程,具有很好的参考价值,希望对大家有所帮助,... 目录前言一、LoadBalancer是什么?二、使用步骤1、启动consul2、客户端加入依赖3、以服务

SpringBoot @Scheduled Cron表达式使用方式

《SpringBoot@ScheduledCron表达式使用方式》:本文主要介绍SpringBoot@ScheduledCron表达式使用方式,具有很好的参考价值,希望对大家有所帮助,如有... 目录Cron 表达式详解1. 表达式格式‌2. 特殊字符解析3. 常用示例‌4. 重点规则5. 动态与复杂场景‌

Spring Boot 集成 Quartz 使用Cron 表达式实现定时任务

《SpringBoot集成Quartz使用Cron表达式实现定时任务》本文介绍了如何在SpringBoot项目中集成Quartz并使用Cron表达式进行任务调度,通过添加Quartz依赖、创... 目录前言1. 添加 Quartz 依赖2. 创建 Quartz 任务3. 配置 Quartz 任务调度4. 启

Vue 调用摄像头扫描条码功能实现代码

《Vue调用摄像头扫描条码功能实现代码》本文介绍了如何使用Vue.js和jsQR库来实现调用摄像头并扫描条码的功能,通过安装依赖、获取摄像头视频流、解析条码等步骤,实现了从开始扫描到停止扫描的完整流... 目录实现步骤:代码实现1. 安装依赖2. vue 页面代码功能说明注意事项以下是一个基于 Vue.js

Spring Boot中定时任务Cron表达式的终极指南最佳实践记录

《SpringBoot中定时任务Cron表达式的终极指南最佳实践记录》本文详细介绍了SpringBoot中定时任务的实现方法,特别是Cron表达式的使用技巧和高级用法,从基础语法到复杂场景,从快速启... 目录一、Cron表达式基础1.1 Cron表达式结构1.2 核心语法规则二、Spring Boot中定

Spring组件初始化扩展点BeanPostProcessor的作用详解

《Spring组件初始化扩展点BeanPostProcessor的作用详解》本文通过实战案例和常见应用场景详细介绍了BeanPostProcessor的使用,并强调了其在Spring扩展中的重要性,感... 目录一、概述二、BeanPostProcessor的作用三、核心方法解析1、postProcessB

kotlin中的行为组件及高级用法

《kotlin中的行为组件及高级用法》Jetpack中的四大行为组件:WorkManager、DataBinding、Coroutines和Lifecycle,分别解决了后台任务调度、数据驱动UI、异... 目录WorkManager工作原理最佳实践Data Binding工作原理进阶技巧Coroutine

讯飞webapi语音识别接口调用示例代码(python)

《讯飞webapi语音识别接口调用示例代码(python)》:本文主要介绍如何使用Python3调用讯飞WebAPI语音识别接口,重点解决了在处理语音识别结果时判断是否为最后一帧的问题,通过运行代... 目录前言一、环境二、引入库三、代码实例四、运行结果五、总结前言基于python3 讯飞webAPI语音