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

es6 函数解构

对象的解构赋值是内部机制,先找回同名属性,再赋值给对应的变量,真正被赋值的是后者。

let node = {type:'Identifier',name:'foo',loc:{start:{line:1,column:1},end:{line:1,column:4}},method:function(){console.log('method');},range:[0,3]
};
//
let {loc:{start:start1},range:[startIndex]
} = node;
//将loc.start 解构值赋给一个start1变量
console.log('@@@@',start1,startIndex); 
//将mehtod 函数解构赋给method1 函数变量
let {method: method1    
} = node;
method1()

不难理解

<template>
<a-upload name="file" :showUploadList="false" :customRequest="(file) => handleImportXls(file, getImportUrl, reload)"><a-button preIcon="ant-design:import-outlined" type="primary">导入</a-button></a-upload><JImportModal @register="registerModalJimport" :url="getImportUrl" online />
</template><script lang="ts" setup>
const [registerModalJimport, {openModal: openModalJimport }] = useModal();function handleImport() {//调用函数openModal: <T = any>(visible = true, data?: T, openOnSet = true): void//设置visible =true 显示弹出框openModalJimport(true);}</script>

useModal.ts


export function useModal(): UseModalReturnType {const modal = ref<Nullable<ModalMethods>>(null);const loaded = ref<Nullable<boolean>>(false);const uid = ref<string>('');function register(modalMethod: ModalMethods, uuid: string) {if (!getCurrentInstance()) {throw new Error('useModal() can only be used inside setup() or functional components!');}uid.value = uuid;isProdMode() &&onUnmounted(() => {modal.value = null;loaded.value = false;dataTransfer[unref(uid)] = null;});if (unref(loaded) && isProdMode() && modalMethod === unref(modal)) return;modal.value = modalMethod;loaded.value = true;modalMethod.emitVisible = (visible: boolean, uid: number) => {visibleData[uid] = visible;};}const getInstance = () => {const instance = unref(modal);if (!instance) {error('useModal instance is undefined!');}return instance;};const methods: ReturnMethods = {setModalProps: (props: Partial<ModalProps>): void => {getInstance()?.setModalProps(props);},getVisible: computed((): boolean => {return visibleData[~~unref(uid)];}),getOpen: computed((): boolean => {return visibleData[~~unref(uid)];}),redoModalHeight: () => {getInstance()?.redoModalHeight?.();},// visible 是否显示	openModal: <T = any>(visible = true, data?: T, openOnSet = true): void => {getInstance()?.setModalProps({open: visible,});if (!data) return;const id = unref(uid);if (openOnSet) {dataTransfer[id] = null;dataTransfer[id] = toRaw(data);return;}const equal = isEqual(toRaw(dataTransfer[id]), toRaw(data));if (!equal) {dataTransfer[id] = toRaw(data);}},closeModal: () => {// update-begin--author:liaozhiyang---date:20231218---for:【QQYUN-6366】升级到antd4.xgetInstance()?.setModalProps({ open: false });// update-end--author:liaozhiyang---date:20231218---for:【QQYUN-6366】升级到antd4.x},};return [register, methods];
}
http://www.xdnf.cn/news/691597.html

相关文章:

  • 【系统架构设计师】2025年上半年真题论文回忆版: 论事件驱动架构及应用(包括解题思路和参考素材)
  • nova14 ultra,是如何防住80°C热水和10000KPa水压冲击的?
  • pytorch部分函数理解
  • 【网络通信】详解网络通信、实现 CS / BS架构 通信
  • xxl-job快速创建复制任务
  • IACEES 2025:创新材料与能源模式,迎接未来的挑战
  • 27、请求处理-【源码分析】-怎么改变默认的_method
  • 【周输入】517周阅读推荐-3
  • Spring Boot 启动流程深度解析:从源码到实践
  • 【烧脑算法】定长滑动窗口:算法题中的“窗口”智慧
  • MySQL OCP 与 Oracle OCP 认证,怎么选?
  • 怎样将win11+ubuntu双系统的ubuntu从机械硬盘迁移至固态硬盘(1)
  • 【Elasticsearch】track_total_hits
  • CAD图纸中的文字看不到,这是什么原因?
  • 传输线的特性阻抗和传播延迟
  • DL00916-基于深度学习的金枪鱼各类别目标检测含完整数据集
  • 131.在 Vue3 中使用 OpenLayers 测量长度和面积,并支持 modifyend 动态更新数值
  • 不打架的协议互通,modbus转profibus网关的总线的高效互通方案
  • C53-字符串引入和注意事项.
  • JavaScript 中 this 指向全解析:从基础到 Vue 应用
  • 【加密算法】
  • Qt/C++开发监控GB28181系统/sip协议/同时支持udp和tcp模式/底层协议解析
  • 【Microsoft 365可用】PPT一键取消所有超链接
  • Python 进阶【二】:多进程编程
  • TCP三次握手/四次握手-TCP/IP四层模型-SSL/TLS-HTTP-HTTPS
  • Bootstrap法进行随机模拟
  • 第11章:工程组织与系列总结
  • 8086 处理器寄存器超详细解析:从原理到实战
  • 三分钟打通Stable Diffusion提示词(附实战手册)
  • TDengine 运维——用户和权限