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

相关文章

Vue3视频播放组件 vue3-video-play使用方式

《Vue3视频播放组件vue3-video-play使用方式》vue3-video-play是Vue3的视频播放组件,基于原生video标签开发,支持MP4和HLS流,提供全局/局部引入方式,可监听... 目录一、安装二、全局引入三、局部引入四、基本使用五、事件监听六、播放 HLS 流七、更多功能总结在 v

Python中的sort方法、sorted函数与lambda表达式及用法详解

《Python中的sort方法、sorted函数与lambda表达式及用法详解》文章对比了Python中list.sort()与sorted()函数的区别,指出sort()原地排序返回None,sor... 目录1. sort()方法1.1 sort()方法1.2 基本语法和参数A. reverse参数B.

MyBatis/MyBatis-Plus同事务循环调用存储过程获取主键重复问题分析及解决

《MyBatis/MyBatis-Plus同事务循环调用存储过程获取主键重复问题分析及解决》MyBatis默认开启一级缓存,同一事务中循环调用查询方法时会重复使用缓存数据,导致获取的序列主键值均为1,... 目录问题原因解决办法如果是存储过程总结问题myBATis有如下代码获取序列作为主键IdMappe

使用Go调用第三方API的方法详解

《使用Go调用第三方API的方法详解》在现代应用开发中,调用第三方API是非常常见的场景,比如获取天气预报、翻译文本、发送短信等,Go作为一门高效并发的编程语言,拥有强大的标准库和丰富的第三方库,可以... 目录引言一、准备工作二、案例1:调用天气查询 API1. 注册并获取 API Key2. 代码实现3

Vue和React受控组件的区别小结

《Vue和React受控组件的区别小结》本文主要介绍了Vue和React受控组件的区别小结,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学... 目录背景React 的实现vue3 的实现写法一:直接修改事件参数写法二:通过ref引用 DOMVu

Java调用Python脚本实现HelloWorld的示例详解

《Java调用Python脚本实现HelloWorld的示例详解》作为程序员,我们经常会遇到需要在Java项目中调用Python脚本的场景,下面我们来看看如何从基础到进阶,一步步实现Java与Pyth... 目录一、环境准备二、基础调用:使用 Runtime.exec()2.1 实现步骤2.2 代码解析三、

Python如何调用另一个类的方法和属性

《Python如何调用另一个类的方法和属性》在Python面向对象编程中,类与类之间的交互是非常常见的场景,本文将详细介绍在Python中一个类如何调用另一个类的方法和属性,大家可以根据需要进行选择... 目录一、前言二、基本调用方式通过实例化调用通过类继承调用三、高级调用方式通过组合方式调用通过类方法/静

C#控制台程序同步调用WebApi实现方式

《C#控制台程序同步调用WebApi实现方式》控制台程序作为Job时,需同步调用WebApi以确保获取返回结果后执行后续操作,否则会引发TaskCanceledException异常,同步处理可避免异... 目录同步调用WebApi方法Cls001类里面的写法总结控制台程序一般当作Job使用,有时候需要控制

Python用Flask封装API及调用详解

《Python用Flask封装API及调用详解》本文介绍Flask的优势(轻量、灵活、易扩展),对比GET/POST表单/JSON请求方式,涵盖错误处理、开发建议及生产环境部署注意事项... 目录一、Flask的优势一、基础设置二、GET请求方式服务端代码客户端调用三、POST表单方式服务端代码客户端调用四

Python跨文件实例化、跨文件调用及导入库示例代码

《Python跨文件实例化、跨文件调用及导入库示例代码》在Python开发过程中,经常会遇到需要在一个工程中调用另一个工程的Python文件的情况,:本文主要介绍Python跨文件实例化、跨文件调... 目录1. 核心对比表格(完整汇总)1.1 自定义模块跨文件调用汇总表1.2 第三方库使用汇总表1.3 导