Element UI 提供了大部分UI控件,但对于拖拽,确实是个短板,于是就需要额外的控件来补充了,即本文档的主角vuedraggable。 从实战角度,以低代码配置功能为例,说明vuedraggable的属性、方法、用法,以及使用过程中遇到的一些坑点及解决方案。 要点如下: group属性的要点 update和sort事件的差别 add事件如何获取数据 如何处理属性重复添加问题 不同列表间拖动group属性无效 实例: 某个业务实体,如用户管理,常见的菜单对应一个列表页面,顶部为页面级功能按钮,如新增、删除、导出等,中间为查询区域,可以放几个常用的查询条件,最下面则是查询结果,以表格形式展现行列数据。查询结果表格的行记录,最后一列放一些针对于该行数据的快捷按钮,如删除、编辑等。 这个配置功能,一方面涉及到元素的排序,如按钮的次序、查询条件的次序、查询结果中列的次序;另一方面涉及到列表间元素的移动,如将实体属性添加到查询列表或查询结果中。如采用传统模式,需要选中某个元素,点击左移、右移等按钮,既不直观,操作也繁琐。而采用拖拽式操作,所见即所得,用户体验大幅提升。 在Vue.js应用中,我们经常需要实现拖拽功能来增强用户体验,特别是在构建低代码平台或者配置界面时。Element UI虽然提供了丰富的UI组件,但对拖拽功能的支持相对较弱。这时,我们可以借助第三方库vuedraggable来实现。vuedraggable是基于Sortable.js的Vue组件,它提供了一套完整的拖拽解决方案,包括触摸设备支持、文本选择、智能滚动、不同列表间的拖放等特性,并且与Vue 2.x的过渡动画兼容。 我们需要安装vuedraggable库。在项目中运行以下命令: ```bash npm install vuedraggable -S ``` 然后,在Vue组件中引入并使用Draggable组件: ```javascript import Draggable from 'vuedraggable'; ``` vuedraggable的核心属性和方法包括: 1. **v-model**: 用于绑定数据,通常是一个数组,表示拖动的元素列表。 2. **group**: 用于设置拖动元素的分组,可以防止不同组间的元素相互干扰。 3. **@sort**: 当元素在组内排序时触发,提供新的元素顺序。 4. **@update**: 在拖放操作结束后触发,无论是否改变了元素顺序,都会触发此事件。 5. **@add**: 当元素添加到列表时触发,可以通过此事件获取新添加的数据。 在实际应用中,例如页面按钮配置场景,我们可以这样设置: ```html {{ item.name }} ``` 在这个例子中,`buttonList`是存储按钮信息的数组,`group`属性定义了拖动分组,`updateSort`和`update`是处理排序和更新的回调函数。`@close`和`@click`事件分别用于删除和修改按钮。 在实际使用中,可能会遇到一些问题,比如元素重复添加和不同列表间拖动group属性无效。为了解决这些问题,我们需要在处理`@add`事件时进行数据校验,确保不添加重复元素。对于group属性无效的问题,通常是因为不同列表间的group值没有正确设置或没有设置。 vuedraggable提供了强大的拖拽功能,可以轻松实现列表排序和元素移动。通过合理利用其属性和事件,我们可以构建出直观易用的界面,提升用户体验。在开发过程中,遇到问题时,可以查阅官方文档或社区资源找到解决方案,确保功能的稳定实现。
2025-06-04 11:11:37 1.41MB vuedraggable
1
内容索引:VC/C++源码,图形处理,几何变换  图象的几何变换,C 的算法实现,运行程序后主先打开一幅BMP位图,然后选择第二项内的某个选项,这些选项的大致意思是,X/Y坐标裁切、裁切、透明化、旋转、放大等。   命令行编译过程如下:   vcvars32   rc bmp.rc   cl geotrans.c bmp.res user32.lib gdi32.lib
1
易飞erp的学习资料,包括客户端、服务器端的安装设置教程,试验指导书。
2025-06-03 14:52:37 10.43MB
1
### S3C6410 JLink调试方法详解 #### 一、概述 S3C6410是一款基于ARM1176JZF-S内核的高性能处理器,广泛应用于嵌入式系统开发中。针对这类处理器的调试,通常会采用JLink作为硬件调试接口。本文将详细介绍使用JLink对S3C6410进行调试的方法,包括所需软件的安装配置、调试工具的使用等关键步骤。 #### 二、准备工作 ##### 2.1 安装RealView Developer Suite v2.2 - **安装方法**:参照RVDS2.2目录下的Readme.Txt文件进行安装。 - **验证成功**:安装完成后,在“程序”菜单中应出现“ARM -> RealView Developer Suite v2.2”。 ##### 2.2 安装JLink ARM V410i - **注意事项**:确保安装4.10版本的JLink,因为4.14版本可能无法正常调试S3C6410。 - **安装路径**:安装光盘上的`Setup_JLinkARM_V410i.zip`。 - **验证成功**:安装成功后,可在“程序”菜单中找到JLink的相关组件。 #### 三、调试环境配置 ##### 3.1 配置AXD Debugger - **添加JLink RDI.dll**: - 打开AXD Debugger。 - 通过“Option -> Configure Target”添加JLink RDI.dll(位于2.2步骤的安装目录下)。 - 单击“OK”完成配置。 #### 四、烧写Bootloader ##### 4.1 准备工作 - **烧写Linux 2.6.28的U-Boot**:参考《TE6410开发板LINUX2.6.28用户手册.pdf》。 - **设置拨码开关**:将开发板的拨码开关设置为NAND启动模式。 ##### 4.2 Bootloader的作用 - 初始化PLL(锁相环)和DDR RAM。 - 为加载程序到内存进行必要的配置。 #### 五、正式调试流程 ##### 5.1 开发板上电 - 给开发板供电并等待初始化完成。 ##### 5.2 加载调试程序 - 打开AXD Debugger。 - 通过“File -> Load Image”选择要调试的.axd文件。 ##### 5.3 设置RO Base地址 - **背景**:由于JLink不支持MMU(内存管理单元),因此需要手动设置RO Base地址。 - **建议值**:设置为0x50200000(S3C6410 DDR RAM的起始地址)。 #### 六、常见问题及解决办法 ##### 6.1 编译错误 - 确保所有软件版本兼容。 - 检查编译配置,确保符合JLink的要求。 ##### 6.2 调试失败 - 检查JLink与开发板之间的连接。 - 确认Bootloader已正确烧写并能够启动。 - 使用JLink的诊断功能排查硬件故障。 #### 七、结语 通过以上步骤,开发者可以顺利地使用JLink对S3C6410进行调试。值得注意的是,整个过程中需要细致地检查每一个环节,确保软件环境的兼容性和硬件连接的可靠性。此外,对于初学者来说,了解AXD Debugger的基本操作是十分重要的。随着实践经验的积累,开发者将能更加熟练地掌握这一调试工具,并提高工作效率。 ### 相关参考资料 - **6410_test.Zip**:包含了一个在RDS下的S3C6410测试工程。 - **Setup_JLinkARM_V410i.Zip**:提供了JLink的安装程序。 - **TE6410开发板LINUX2.6.28用户手册.pdf**:详细介绍了如何烧写U-Boot到NAND上。 - **RVDS2.2目录下的Readme.Txt**:提供了RVDS2.2的具体安装指南。
2025-06-03 10:18:37 171KB jlink调试步骤 AXD的操作 程序编写
1
易语言浏览器操作模块源码 易语言浏览器操作模块源码 分类: 初级教程 关键字: 易语言例程 超文本浏览框 易语言教程 易语言模块 文本文件 易语言源码 易语言浏览器操作模块源码例程程序结合易语言超文本浏览框支持库,实现了通过浏览器操作模块的功能。 内容介绍 易语言浏览器操作模块源码例程程序结合易语言超文本浏览框支持库,实现了通过浏览器操作模块的功能。本易语言例程源码是易语言论坛用户编写的教程,属于易语言初级教程。 点评:本程序结合易语言超文本浏览框支持库,实现了通过浏览器操作模块的功能。
2025-06-02 21:09:44 7KB 易语言例程
1
乐企数字开放平台操作手册-能力中心分册V2.000
2025-05-28 14:03:11 5.29MB
1
乐企数字开放平台操作手册-纳税人端自用申请分册V2.000
2025-05-28 14:02:56 4.39MB
1
乐企数字开放平台-沙箱操作指引(用票)V1.002
2025-05-28 14:02:45 385KB
1
电子税务局纳税人登录乐企能力开放平台后,为了使纳税人能够使用乐企平台的能力中心部分,该文档主要介绍了【能力中心】-【我的能力】的功能概述、操作步骤以及注意事项。可以帮助纳税人开通乐企服务后,浏览能力列表,查看能力有效期及当前各项能力开通状态。 《乐企数字开放平台操作手册-能力中心分册》是一本详细介绍了乐企平台中能力中心功能的使用手册。通过这份手册,纳税人可以深入了解如何在乐企平台上使用能力中心的各项功能,包括查看能力列表、能力的有效期和开通状态,以及如何申请开通新的能力。该手册不仅适用于已经开通乐企服务的纳税人,也适用于那些希望了解如何利用乐企平台进行税务相关服务的用户。 手册的结构清晰,内容详实,共分为几个主要部分。首先是概述部分,旨在为纳税人提供对能力中心功能的基本理解,以及开通乐企服务后能做什么。接下来是首页部分,介绍了纳税人登录平台后,如何通过首页的快捷菜单和能力推荐进行操作,以及如何申请未开通的能力。 重点内容在能力中心部分,详细描述了如何进入“我的能力”功能页面,并展示了功能菜单的操作步骤。在这个部分,纳税人可以浏览并操作公用基础能力和非公用基础能力,以及根据能力开通状态切换展示的能力列表。用户还可以在功能概述中详细了解每个能力的有效期和开通状态,并进行能力详情的查看。此外,手册还向纳税人展示了如何进行能力的申请,包括单个和批量申请的具体操作步骤。 在具体的操作指引中,手册首先要求纳税人满足前置条件,即接入申请必须通过。之后,详细的步骤指导纳税人如何点击并进入能力详情页面,如何在不同状态下切换查看接口列表、开发指引等信息,并通过“申请开通”按钮进行操作。手册还特别提醒,用户在进行批量开通能力时,只能勾选同类型的能力,并确保能力开通状态为“未开通”。 手册的强调了一些注意事项,例如批量勾选能力时的限制条件,以及能力开通页面操作的细节。这些注意事项帮助纳税人更好地理解操作流程,避免在申请过程中出现错误。 综合来看,这本手册是一份针对乐企平台能力中心操作的完整指南,它不仅涵盖了从基本功能到操作步骤的全面信息,还包括了使用过程中的重要提示,确保纳税人能够高效便捷地使用乐企平台的各项功能。对于正在使用或计划使用乐企平台的纳税人来说,这是一份不可或缺的参考资料。
2025-05-28 12:33:32 958KB 开放平台
1
1.1 实验目的 实验目的: •以控制工程相关专业的典型系统和设备为对象 • 旨在让学生了解和掌握智能机器人、运动控制、机器视觉系统的特点、系统结构与内容、 处理方法和手段、系统原理及高新技术的应用 • 使学生能够掌握相关技术并能独立进行开发和研究工作。 • 通过实验掌握相关实验系统及研究领域的主要原理和系统结构 • 并深刻理解相关基本概念 • 理解理论知识与实际系统之间的依存互动关系 • 培养专业研究生综合素质 • 在今后工作中,具有独立设计、实现完整中、小规模专业任务的能力 • 能适应机器人、工业生产、机器视觉、航空航天等众多行业领域的应用需求。 1.2 Dobot Magician 写毛笔字 在开始进行 Dobot Magician 写毛笔字和搬运积木两个实验之前,需要安装 DobotStudio 控制软件,并按照指导书将计算机与 Dobot 机械臂相连,保证控制软件可以对机械臂进行控 制。 Dobot 魔术师写毛笔字的实验任务是利用 Dobot 机械臂和滑轨完成毛笔字的自动书写, 书写内容是“控制综合实验”加组员姓名,且在机械臂写毛笔字的过程中,需包含必要的蘸 墨动作,以保证毛笔字体的清晰度。控制机器人自动完成毛笔字的书写动作。 下面对此实验内容进行简要概述:在滑轨和 DobotStudio 控制软件安装成功之后,接下 来进行写毛笔字的实验。首先利用 CorelDRAW X7 软件,对“控制综合实验涂浩袁隽殊李艳”
2025-05-28 11:43:05 3.34MB ROS操作系统 Dobot机器人 写毛笔字 Ubuntu
1