低代码配置-属性配置面板设计

已于 2024-01-17 13:42:52 修改
阅读量486 收藏 8
点赞数 8
分类专栏： Vue 3.0 低代码 前端工程化 文章标签： 前端 vue.js 低代码
于 2024-01-15 10:42:11 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/AIB_Kasic/article/details/135595748
版权
Vue 3.0 同时被 3 个专栏收录
100 篇文章 1 订阅
订阅专栏
前端工程化
21 篇文章 0 订阅
订阅专栏
低代码
17 篇文章 0 订阅
订阅专栏
本文讨论了在IT项目中如何进行模块设计，特别是关注了tab项切换、组件的基础、数据和事件属性设置，以及表单属性的管理，包括数据来源的接口调用方式和表单属性面板的独立执行策略。
摘要由CSDN通过智能技术生成

  • 模块设计

    • tab项切换
      • 组件基础属性
      • 组件数据属性
      • 组件事件属性
      • 表单属性

  • 模块输出函数设计

    • tab切换函数

  • 列表表单属性

    • 数据来源： 调用接口时一次赋予，无需使用selectItem，如需使用，归入基础属性
    • 列表标题
    • 是否展示筛选区域

示例：在这里插入图片描述

//
  • 表单属性面板独立执行
    使用路径上的type执行不同的模块，定义好不同的策略
土生土长的IU
关注
专栏目录
微信小城程序组件---折叠面板
12-20
在微信小程序开发中，创建可交互的用户界面是至关重要的，而折叠面板（Fold Row）组件则是一个常用且实用的设计元素。它允许用户通过点击标题来展开或隐藏内容区域，以此来节省屏幕空间并提高用户体验。现在我们来...
AmazeUI 折叠面板的实现代码
11-19
一旦设置了这些基础结构和引用，浏览器加载页面后，AmazeUI 会自动识别并处理`data-am-collapse`属性，使折叠面板具备点击标题展开/折叠内容的交互功能。默认情况下，AmazeUI 折叠面板只允许单个面板处于展开状态，...
一般网站的风格及页面设计
qq_61141142的博客
06-05 611
新建页面就象一张白纸，没有任何表格，框架和约定俗成的东西，你可以尽可能的发挥你的想象力，将你想到的“景象”画上去，建议用一张白纸和一支铅笔将初步的设想画在纸上，当然用作图软件photoshop等也可以，免得在做了一半时发现页面不和谐而重做。这里要特别指出的是，网标，它是一个网站的标志和灵魂，在他的设计上一定要突出自己的风格和特点，能反映站点主题，体现企业文化，可以结合使用企业的标志。由于没有使用框架，各个模块的页面需要在此的基础上，在页面结构的“体”处加入实现功能特点的页面代码。直线（矩形）的应用。
从零实现一套低代码（保姆级教程） --- 【5】实现组件和属性面板的交互
weixin_46726346的博客
12-25 1235
在上一篇中，我们简单实现了右侧属性面板。可以通过更改按钮文字，重新渲染Button组件。目前来到了本系列的第五章，本篇主要是实现Button组件的全部属性配置。在第一节中，说了本系列会实现出什么样的低代码项目。同时对技术栈等相关因素进行了分析。但是本系列因为是对线上例子的重构，所以实现的可能会有所差异。关于属性面板的配置，可能是整个系列中比较重要的。因为低代码主要的想法就是通过可视化的配置来决定页面的结构和样式。那么如果属性这一章节可以通透起来，后面的样式，动作等配置都是手到擒来了。
上手阿里低代码引擎lowcode-engine
lyd的博客
11-13 5375
lowcode-engine实现表格页面简单的增删改查
低代码表单配置平台替代普通表单配置平台，前端部分重构的设计和思路
Christopher的博客
06-30 1294
最近将公司的旧表单配置平台重构为低代码表单配置平台，这里记录一下这个过程的设计和思路，不涉及具体的代码；另外这篇文章基本只涉及前端部分，也不涉及与后端数据交互部分。 思路：组件层面，抽象层面，物料区，渲染区，设置区 关键点：原子组件库，schema，物料区，渲染区，设置区 实现细节：原子组件库，schema，拖拽库，物料区，渲染区的状态，渲染区的交互逻辑，设置区，保存
基于React低代码平台开发：构建高效、灵活的应用新范式
程序边界
03-04 6512
本书由三部分组成，第 一部分介绍基础理论知识，第二部分介绍如何构建低代码系统，先进行需求分析，涉及列表页、详情页和表单页的布局需求和逻辑需求，可视化编辑器、应用管理、组件市场和用户管理的需求等内容，然后介绍设计思路，包含架构设计、Schema 设计、组件库市场和 MongoDB Document 设计等，z后介绍详细的编码过程，包括可视化编辑器的实现、渲染 SDK 的实现、版本控制，以及如何将其集成到其他系统。秦小倩（网名何遇）
React低代码平台实战：构建高效、灵活的应用新范式
想你依然心痛的博客
03-14 1万+
随着技术的不断发展，低代码开发平台已经成为了构建高效、灵活的应用程序的新范式。而基于React的低代码平台更是引领了这一潮流。React作为一种强大而灵活的JavaScript库，其组件化的架构使得开发人员能够更加高效地构建复杂的应用程序。结合低代码开发平台的快速开发特性，基于React的低代码平台为开发人员提供了一个更加便捷、高效的开发环境。通过基于React的低代码平台，开发人员可以通过拖拽组件、配置属性等简单的操作，快速构建出各种类型的应用程序。
iVX低代码平台系列详解 --界面功能(一)
白大锅的博客，毕设WangLoveBai_999
10-28 2万+
iVX低代码深入学习：https://www.ivx.cn?extend=baidaguoiVX系列教程持续更新中 系列文章可看： iVX低代码平台系列详解 – 概述篇(一) iVX低代码平台系列详解 – 概述篇(二) iVX低代码平台系列详解 – 概述篇(三) iVX低代码平台系列详解 – 系统架构组件栏具有以下功能特性：我们可以通过鼠标悬浮任意一个组件，来查看其相应的文档： · 对象树 对象树是进行对象管理的重要窗口。当前开发环境中添加的每种组件都会被对象树记录，以树状结构进行可视化的展示，例如下图：
一站式低代码开发平台iVX初探
热门推荐
dvlinker的技术专栏
08-31 2万+
详细介绍一站式低代码开发平台iVX。
ivx低代码开发平台
码银的博客
06-26 1万+
这是一个浏览器端的IDE（整合开发环境）；尽可能无代码并能支持全场景应用的开发；尽可能一次开发支持多套系统运营；并且对云和应用导出部署有良好的支持。iVX，可以理解为一种可视化的“全栈代码生成器”，而且这种“代码生成”做得相当彻底，几乎所有应用都可以通过iVX在不写任何代码的情况下进行“自动代码生成”。iVX平台研发难度极大，涉及技术领域也非常广，在全球领域能自动生成全栈代码的，据我所知，仅此一家。
【低代码平台】商城可视化搭建平台 -Mall-Cook
01-22
总结来说，Mall-Cook 是一个基于 Json Schema 标准的低代码商城搭建平台，它的可视化组件属性面板简化了页面构建过程，而 package.json 文件和 Mall-Cook 相关源代码或资源则为开发者提供了完善的开发环境和支持。...
Kettle3.2组件配置面板源代码分析[归类].pdf
10-19
这篇源代码分析主要集中在JobEntryDialogInterface接口和JobEntryDialog基类以及具体的配置面板实现，如JobEntryDeleteFileDialog。 1. **JobEntryDialogInterface接口**： 这个接口定义了一个关键的方法`open()`...
WEBRTC教程:局域网怎么调试，http://172.19.18.101:8080 ,无法访问摄像头和麦克风，请检查权限
keyboard专栏
10-25 1123
在局域网中使用 WebRTC 时，无法访问摄像头和麦克风通常是因为浏览器的安全策略限制了API 的使用。如果你在非localhost或非 HTTPS 环境下访问网页，浏览器会阻止访问摄像头和麦克风。localhost大多数浏览器允许在localhost上使用，即使没有 HTTPS。所以你可以在服务器和客户端同一台机器上使用localhost进行测试。如果你需要在局域网的 IP 地址上（如）进行访问，那么使用 HTTPS 是解决方案之一。通过配置 HTTPS，你可以避免浏览器的安全限制。使用openssl。
vue如何让下拉框可以输入---查询下拉框内容
qq_42666729的博客
10-28 456
使用filterable。
JavaScript中this的指向和改变this指向的方法 - 2024最新版前端秋招面试短期突击面试题【100道】
everfoot的博客
10-29 632
了解this的工作原理是掌握JavaScript的关键之一，特别是在编写复杂的应用程序时。正确使用this可以避免许多常见的问题和错误。在实际开发中，合理选择不同的绑定方法，可以让你的代码更加灵活和易于维护。掌握这些this的知识点将帮助你在前端面试中脱颖而出！祝你顺利上岸！
前端 常见开发工具使用
最新发布
weixin_45534301的博客
10-31 324
【代码】前端 常见开发工具使用。
CSS3新增盒子属性
。
10-28 936
介绍CSS3新增盒子属性。
Google Recaptcha V2 简单使用
吴家健ken的博客
10-30 211
Google Recaptcha V2 简单使用
Windows Server 2003安装与配置FTP服务详解
"启用日志记录参数-Win2003-安装和配置FTP服务" 本文将详细介绍如何在Windows Server 2003上安装、配置FTP服务，并启用日志记录参数，以便更好地管理和监控FTP服务器的运行状态。 FTP（File Transfer Protocol）是...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值