使用ivx实现拖拽上传文件功能的经验总结

最新推荐文章于 2023-04-27 17:07:03 发布
最新推荐文章于 2023-04-27 17:07:03 发布
阅读量734 收藏 2
点赞数
分类专栏： ivx
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/VXLab/article/details/105227818
版权
本文介绍了如何使用ivx通过拖拽放置容器实现上传文件功能。首先，讲述了拖拽放置容器的工作原理及如何获取拖拽文件信息。接着，详细说明了如何设计数据库字段、添加服务来存储上传文件的信息。然后，阐述了前台拖拽上传的实现，包括文件上传回调的处理和文件列表的展示。最后，提供了优化用户体验的建议，如在拖拽事件中改变容器背景色以增强反馈效果。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

在实际案例中经常会使用到上传文件的功能，不过普通的上传文件需要用户再去一层一层查找文件的路径并不是十分的方便，今天给大家讲一种使用拖拽放置容器实现上传文件的方法。
在这里插入图片描述
1.拖拽放置容器
拖拽放置容器位于拓展组件中的特殊功能容器类，我们可以给它添加事件拖拽放置，此事件的动作中我们能获取一个返回值——拖拽文件，在调试记录中打印出来可以看到里面包含文件的名称、大小和类型等信息。
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
不过拖拽放置容器只是把文件拖拽进来，上传到服务器还是要使用文件接口组件。文件接口上传文件动作的回调中会收到文件上传到服务器后的一些信息参数。
在这里插入图片描述
在这里插入图片描述
2.

最低0.47元/天 解锁文章
使用ivx实现批量上传图片的经验总结
VXLab的博客
04-02 852
通常我们使用上传图片都是上传单张，在ivx中其实也提供了批量上传图片的功能，今天就讲一下批量上传图片的具体操作。 1.图片列表 首先需要用一个对象数组存储批量上传的图片，然后用for容器循环创建一个图片列表。每个图片后面都有一个圆框关闭的图标，可以将当前数据从对象数组中删除，当然这里的删除只是从前台的对象数组中删除。 2批量上传图片 然后就是图片上传的部分，这里使用的是文件接口组件读取多张本...
iVX开发中整理的常见问题与回答（一）
VXLab的博客
04-27 4570
iVX开发过程中常见问题及回答
iVX开发中整理的常见问题与回答（三）
最新发布
VXLab的博客
04-27 1394
ivx开发常见问题及回答
发布功能完成02《ivx低代码签到系统制作》
1_bit 的博客
06-23 4427
制作iVX 低代码项目需要进入在线IDE：https://editor.ivx.cn/上一节我们制作了后台的页面，那么此时我们应该需要制作发布功能了，那么在制作之前，我们应该思考一下如何制作这个签到内容发布的功能。首先发布签到的功能肯定是需要有一个数据库进行存储，这个存储那要什么字段呢？首先我们应该想到，需要先有签到名，也就是当前签到是什么签到，例如“***会议签到”之类的，那么此时我们创建一个数据库。点击后台，创建一个数据库命名为签到数据库： 添加了数据库后咱们在其中添加字段签到名： 那么此时我们应该想
API是什么？iVX中的API组件该如何使用？
deadlinefighter的博客
09-27 1111
API API组件图表 简介 API，即应用程序接口（Application Programming Interface，简称：API）。是一些由服务商提供或用户自主开发的预定义函数，它对程序内核进行了封装，仅保留数据的输入接口与用户进行通讯，并通过运算返回一个数据值。API的目的是在无需访问源码，或理解内部工作机制的前提下，赋予应用程序开发人员访问一组例程或进行数据通讯的能力。 iH5的Api系统目前可同时支持ih5内置api、用户自主添加的api。 【使用场景】 随着API服务接口日渐开放，我们可以通
iVX低代码平台系列制作APP简单的个人界面
码莎拉蒂
11-07 1万+
我们知道，目前市场上开发app或者小程序这些应用，都离不开一个个人界面，就是类似下面的这种界面，我们可以利用iVX低代码平台来开发，简单快速，如果还有不知道iVX低代码平台是啥的，猛戳这里:关于ivx当前，小伙伴还可以点击这里进去​​我们没花多少时间就开发出一个非常丝滑的页面，也就是不到10分钟，如果是原生开发的话，这个界面至少需要半个工作日时间，所以利用ivx能节省人力成本。
十、小程序实战 （IVX 快速开发教程）
1_bit 的博客
09-09 2480
六、小程序实战 使用小程序完成一个二手信息站点与 WebApp 实现流程类型，只是部分内容使用了微信小程序特有的组件，例如微信登录与 WebApp 略有差别，其它逻辑实现较为类似。我们先制作页面，之后再实现功能。 由于之前已经完成了一个 Web 站点的编写，在此为了节省阅读成本，同样重复的内容不再进行赘述。 6.1 完成小程序二手交易站点首页开发 首先我们创建一个二手交易小程序程序： 创建完毕后添加一个页面，作为小程序的登录界面。该登录界面需要授权微信账户直接进行登录，在此我们就不需要额外的登录页和注册页
iVX常用开发技巧（2）—环境宽实现自适应
homjeong的博客
04-15 948
（一）使用场景 环境宽是行、列组件的属性，在网页开发的过程中，我们需要让网页去适应不同的显示屏的大小，也就是页面的自适应，这时我们就可以用到环境宽属性来实现页面在pc端、手机端无差错的显示。如下图所示的图书管理系统，在网页窗口的大小发生变化时，书籍信息的布局也会自动的做相应调整。 全屏显示下，每行有三列书籍信息。 2.缩小到一定程度后，每行显示两列书籍信息。 3.再缩小后，每行只显示一列书籍信息。 （二）基本用法 要做到上述效果，只需要对书籍信息的单元UI这行进行环境宽属性...
二、文章发布页制作及后台实现《iVX低代码/无代码个人博客制作》
1_bit 的博客
05-24 7304
一、文章编辑页制作 当首页制作完毕后，需要显示内容就需要有文章数据，此时我们创建一个文章编辑页增加对应的数据。 那么我们创建一个页面，命名为文章发布页： 接着我们查看标题部分： 此部分为左右两边，左侧为标题提示输入和一个标题的文本输入框，右侧是一个发布按钮，此时我们创建左右两行： 由于左右两行需要在同一行显示，那么此时我们就需要设置左右两行的宽度为 50%，使其不占满超过100%的宽度居于一行，并且需要设置高度为包裹： 接着在左侧添加一个文本以及一个输入框： 那么右侧就是一个发布按钮，发布按钮更改
使用ivx画布的遮罩效果实现滑动解锁的经验总结
VXLab的博客
03-27 775
在案例中的注册、重置密码和修改信息等部分，为了确保操作对象是用户而不是机器盗刷，我们常用到验证码。今天我们就结合画布中的遮罩功能来实现一种常用的拼图滑块解锁式验证码。 1.遮罩 遮罩是画布下才能使用的一种功能，作用是让两个组件，一个负责提供形状一个负责提供图案，比如demo中这两张图片，拼图（彩）是一张拼图形状的白色图片，背景（动）是一张背景彩图。 将拼图（彩）移动到背景（动）的上面，并将背景...
使用ivx的瀑布流容器显示图片经验总结
qq_42007832的博客
03-05 716
1.先创建一个数据库导入图片资源数据，然后创建一个服务用于按页数输出数据，添加我们所要用到的数据，然后在页面下添加一个瀑布流容器，瀑布流容器在左上角的扩展组件里 因为我们要通过数组展示多个瀑布流卡片，所以这里先在容器下添加一个循环，将要展示的图片数据与该循环绑定，然后再在循环里添加瀑布流卡片，瀑布流卡片的添加也是在左上角的扩展组件里。 2.如果要通过一些条件区别达到不同的展示效果，可以通过if判断...
关于ivx地图组件的经验总结
VXLab的博客
04-17 838
地图组件是常用的UI组件之一，ivx中的地图组件是调用了腾讯地图的API，具有腾讯地图的基本功能，除了用于目标地点的地图展示和导航外，还可用于制作打卡、共享单车等地图类应用。下面是地图组件可以执行的动作，包括获取坐标、计算距离、经纬度与地址转换等等。 地图组件中还可以添加几种用于地图标记的子组件，地图圆形覆盖物需要我们设置中心点的坐标和圆形半径；地图折线覆盖物是用一个对象数组保存各个点的坐标然后...
关于ivx短信组件的经验总结
VXLab的博客
04-29 382
在ivx中除了邮件组件外还提供了短信组件，在应用后台添加短信组件后，可以使用短信组件的发送短信功能，向指定的手机号码发送模板短信。与邮件类似，发送成功的短信，会记录在短信的数据表中，并按￥0.1元/条的标准扣除相应的费用。同时，也支持对短信数据表的输出和分类统计，与普通数据库的输出和统计类似。 发送短信动作分为模板短信和自定义短信，模板短信目前提供了八种模板，选择每种模板后只需要设置自己的变量即...
使用ivx实现菜单导航的经验总结
VXLab的博客
03-26 1430
前面已经说过了标签导航和页面导航的实现方式，今天再补充一种菜单导航的实现方法。它多见于网站的顶部或侧面的主导航条。一个导航条可能是多个导航菜单的组合。 1.首先，我们是用一个横幅作为导航条，在里面添加好各个菜单，再添加三个横幅分别作为三个标签的弹出菜单。这三个横幅的可见属性分别绑定了一个布尔值变量，其对应的布尔值变量为true则横幅可见，若为false则横幅隐藏。 2.给三个作为标签的文本组...
关于iVX平台实现的总体技术栈【低代码/无代码、可视化开发语言】
troymeng的博客
12-01 1万+
iVX刚推出的时间不长，现在还处于公测阶段，个人用户和工具使用都是免费的，应用处于运营阶段才收费。 总体来说（如下图），相当于“一款零代码可视化编程语言”+“IDE的集成开发环境（自带编译器）+“配套云端IAAS资源” 可以实现：一站式研发、一站式部署、一站式维护的完整的在线开发体系。 iVX平台整体 一、“前后台”一体 前端和后台的能力都很强大，支持中大型各种应用的开发，同时支持各种目标平台的应用。 应用场景包括： 企业内部系统（OA HR CRM 文档协作 BPM工作流引擎 表单引擎
iVX中能便捷的自定义鼠标指针吗？顺便推荐几个好用的cur转换工具和图片压缩工具
deadlinefighter的博客
07-20 1346
最近，在用iVX制作一个游戏，需要自定义鼠标指针。 一开始，我还到处找网页改变指针的代码，一个个试着套进iVX，都以失败告终……（因为不懂代码〒▽〒） 正在心灰意冷的时候，突然发现系统界面有一个修改鼠标指针的动作！！！ 一、UI及效果展示 UI很简单，主要用于展示已上传图标的图片组件以及触发上传事件的按钮 UI布局和对象树 效果展示：https://v4pre.h5sys.cn/play/FDSw9YrY 效果展示 二、事件面板 按钮点击事件 1、点击按钮，...
使用ivx开发web全栈项目 初探（一）
热门推荐
xiongwn的博客
09-03 1万+
一、前言 本人是一枚喜欢探索黑科技的web前端，没事喜欢研究研究框架，了解网络技术/工具等等。最近在研究saas和paas的时候在知乎专栏有大佬提到了一款在线页面编辑系统——ivx。看到这里在做的大佬估计表示不屑，不就是在线编排h5的工具网站嘛，这种东西国内不多得是：135编辑器、秀米、易点，大同小异都是集成的富文本编辑器，允许你使用封装好的事件触发器、动画效果、自定义css样式，感觉没什么技术含...
零代码可视化编程语言iVX是什么？
VXLab的博客
07-31 6099
现在的代码开发方式，已经诞生了半个多世纪了，形成了一整套完整的开发体系，至今任然沿用。语言诞生了很多种，PHP/ Java/ Python/ C#/ JavaScript/ Go… ，但本质上并没有发生什么改变，还是要一行一行的Coding。 iVX（Visual eXperience）尝试改变这一切，建立一套全新的零代码可视化开发体系，在几乎“Zero”代码的条件下，完成所有应用的开发，并且可以让开发者在“Zero”编程基础的条件下快速掌握前后端的开发技能。 iVX的三重属性（三位一体） 一、语言属性：i
七、功能性组件与事件逻辑（IVX 快速开发教程）
1_bit 的博客
09-09 2388
七、功能性组件与事件逻辑 由于 iVX 极度易用的特性，在 iVX 中开发微信小程序、Web App、小游戏应用的开发流程大致相同，介绍完基础可视化组件后通过后台的服务、数据库与事件结合即可完成一个应用的开发；此篇将会介绍 iVX 功能性组件与事件，包括微信小程序、小游戏事件。 ...
改进IVX回归法探究股票收益预测的稳健统计学检验
本文主要探讨了"Robust Econometric Inference for Stock Return Predictability - IVX"这一主题，它代表了一项在量化投资领域中的重要研究。IVX回归作为经典方法的改良版本，着重于解决股票收益预测中的稳健经济...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值