前端项目构建过程中涉及低代码部分思考

表单常见的增删查改的重复问题解决

1市面上有很多表单设计器与框架进行结合,封装一个表单组件,结合响应式,然后给到我们下载使用
2修改起来很麻烦,有局限,但我们可以参考他们的思路,来设计符合项目的组件来帮助我们早点下班
3通用思路是布局,控件,数据,然后常用的功能,上传,验证。
4通常是数组循环,包含布局,控件,数据每一项对应的响应式。
5功能有简单的,也有复杂的,比如模糊查询,上传文件,图片,然后富文本,自定义组件等等,这些我们应该怎么处理循环?
6vue有component组件 也有jsx写法,通常传入一个自定义组件名称给到component,但这个is绑定只支持组件实例的对象,也就是我们需要先把组件对象创造出来。
7webpack存在require读取的方法,在编译的时候读取文件夹,也可以自己手动的import组件然后给到一个对象,然后名称与对象进行映射取值,这样就保证了组件渲染。
8组件通常是需要接收参数,传出事件,然后响应式绑定参数,以及样式改变,有v-bind v-on之类的解构操作
9布局结合组件库栅格布局,然后处理了组件,表单就可以处理完成。
10列表,弹框,表单,构成了后台大多数功能,
11在很多情况下都存在没办法全部适配的需求,所以我们不能保证全部解决,解决常用的就ok

解决很多项目里很多import的处理

比如webpack require,vite的import glob之类的,然后有自动注册的插件,也有webpack配置全局变量,rollup也存在虚拟模块的用法,通常有接口,字典,组件,图片,以及各种函数,插件,样式等等的引入,导致页面内容过多import,之前是使用原型,后来发现全局混入,操作组件实例,也很方便,图片也可以使用require方法处理,图片 svg jpg png 也可以使用这样的方法导入。

因组件和表单的结合引发代码层面的组合

当表单和组件可以组合,那图表在大屏的使用,以及物料组件,拖拽,在低代码平台的使用,都是差不多的思路,
物料组件,根据一个大组件接收一个数组的参数,在拖拽完成的时候改变,然后点击循环的某一项取出来符合封装表单设计器的要求,来读取组件配置,修改内容。这样预览界面其实就是取数组,给到组件来展示内容。
大屏的低代码就是这样开始的,各种物料组件会包含一些自定义的属性,字典,接口,图片,请求,参数,甚至事件,都是配置在每一项里,循环按照规范封装抛出或者执行。

常见的表单设计器就是这样,后面的大屏低代码就变成了拖拽图表,然后修改图表,大屏包含图表,图片,自定义效果组件,然后地图,图标,接口,请求。

甚至在自定义的流程设计后台里也存在这样的表单设计器的操作。这样流行的变化,就引出了h5,uniapp,移动端的操作;

移动端的低代码设计

比如开发uniapp低代码,通常是以pc展示实现拖拽功能,使用uniapp的写法,左边是物料组件,中间是循环出来的页面,右边是表单设计器。只不过换成了uniapp组件库来实现,然后提供一个下载,预览的功能,也就是内容包含了,拖拽组件的数组,以及核心的大组件,以及涉及到了各种小组件。这样就使用uniapp重新打开这个文件,配置一下自己的接口,然后写一点数据交互几乎就完成了。
拓展到后台低代码 以及 h5,其实不推荐做成品低代码,只推荐实现代码层面的实现

因为做好后,会干掉很多人,所以尽量的保护自己的东西,拓展各种组件进行维护,除非是你自己的产品。

大屏开发物料组件的思考
大屏的图表一般选择echart4 5 图表,但目前还需要gis地图 比如高德,百度,mapbox,cesium,three,这些定制化的地图需求,所以这些定制化很高的组件,如果融合在一个项目里,不好维护,有些是使用umd远程组件的方法,注册组件然后异步加载,或者使用webpack5的邦联模块开发,有些是使用npm包的形式安装,处理组件支持,使用webpack vite 之类的 结合组件库来完成比如vue加element等等。

组件单元测试的需求

很多代码层面的低代码就有各种不同项目的不同组件,如何保证组件的高质量,以及在迭代过程中的问题,就需要使用单元测试来保证,比如思考哪些组件是必须写测试哪些没必要,市面上流行的插件有好几种,但落地起来,恐怕困难,因为很多做了更好,不做也没事的东西,在业务面前全部要让路。开发者也必须要有前瞻性,务实性,懂的取舍权衡。项目有发展好才有你的岗位

ai和开发的结合

在开发过程中,注释,测试,函数功能,以及页面样式,其实都可以让他提示我们完成,这是驱动我们的更有效率的方法,目前据说大厂内部的ai以及可以根据功能来完成代码,也有ai完成游戏剧情,甚至已经有了ai程序员,工具会替换很多人,这是时代的发展,但工具也是需要很多人一起使用落地,才可以发光发热。很多的ai都是结合编辑器。比如vscode的很多插件。在开发插件的过程中,可以可以使用vs的插件api来判断文件内容,类型,提示语句,然后接入python的接口大模型,或者ai的接口,也可以是第三方的等等,来帮助编辑代码更方便。毕竟百花齐放的vs插件生态,肯定是时代的发展。

h5游戏与小程序应用

JavaScript有各种游戏引擎开发二d的,3d的,混合开发,嵌入使用,等等。然后各种模拟的物理引擎,特效,webgl,纯h5的游戏,pc的游戏,都可以嵌入webview,也都可以结合electron打包客户端,甚至有uniapp的跨端打包,支持ios 安卓,老版的鸿蒙也支持,新版arkts,大概需要另一种打包方法。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/760265.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

面试笔记——Redis(分布式锁的使用场景及实现原理)

分布式锁的使用场景 资源竞争控制:多个客户端同时访问共享资源时,可以使用分布式锁来控制资源的并发访问,防止多个客户端同时对同一资源进行修改造成数据不一致的问题。 避免重复操作:在分布式环境中,可能会出现多个客…

算法51:动态规划专练(力扣139题,单词拆分)---从左往右尝试模型的误区

题目: 给你一个字符串 s 和一个字符串列表 wordDict 作为字典。如果可以利用字典中出现的一个或多个单词拼接出 s 则返回 true。 注意:不要求字典中出现的单词全部都使用,并且字典中的单词可以重复使用。 示例 1: 输入: s &qu…

如何实现手机遥控端关机按钮同时关闭TV端和手机端界面

目前家庭电视机主要通过其自带的遥控器进行操控,实现的功能较为单一。例如,当我们要在TV端搜索节目时,电视机在遥控器的操控下往往只能完成一些字母或数字的输入,而无法输入其他复杂的内容。分布式遥控器将手机的输入能力和电视遥…

基于springboot+vue的智慧生活商城系统

博主主页:猫头鹰源码 博主简介:Java领域优质创作者、CSDN博客专家、阿里云专家博主、公司架构师、全网粉丝5万、专注Java技术领域和毕业设计项目实战,欢迎高校老师\讲师\同行交流合作 ​主要内容:毕业设计(Javaweb项目|小程序|Pyt…

Pytest自动化测试执行环境切换的两种解决方案(超详细)

🍅 视频学习:文末有免费的配套视频可观看 🍅 点击文末小卡片 ,免费获取软件测试全套资料,资料在手,涨薪更快 痛点分析 在实际企业的项目中,自动化测试的代码往往需要在不同的环境中进行切换&am…

蓝桥:重新排序(差分,python)

前言: 本题在模拟考试时还不会差分法,用纯暴力思路ac了60%的案列,之后看了蓝桥讲解,用差分做出来了(但对差分还是一知半解),最近学会了差分又来做本题,又卡在了技巧思路上&#xff…

【超细完整版】C# WebService 通过URL生成WSDL文件和DLL文件 【生成篇】

目的 支持通过web url (自适应“?wsdl”的有无) 生成.wsdl文件 和 .dll文件 实现 将通过一个类的三部分来实现这些功能 获取url中的ClassName (GetClassNameFromUrl)转换为WSDL文件 (UrlToWsdlFile)转换为DLL文件 (…

【算法】数组-二分搜索法

对应力扣704题目 左闭右闭 public class Solution{ public static void main(String[] args){ int[] nums {1,2,3,4,5,6,7,8,9,10}; int target 5; Solution solution new Soulution(); int result solution.search( nums, target); System.out.println("找到值的位置…

利用代理IP突破地域限制:解锁全球网络访问攻略

利用代理IP突破地域限制,实现解锁全球网络访问,是一种常见的网络技术手段。以下是一份详细的攻略: 1. 理解代理IP: 代理IP就像一个中间人,你的请求先发送到代理服务器,然后由代理服务器去获取你想要访问的网…

【STL基础】vector、stack、queue、list、pair、map、unordered_map、set、unordered_set(详细讲解)

vector、list、pair、unordered_map、unordered_set、stack、queue 参考文章: (1)【apollo】泛型编程 与 STL (2)c stack用法 入门必看 超详细 (3)C中queue的用法(超详细&#xff0c…

C语言关于void类型的指针作为函数形参在使用时需要注意的坑

目录 前言 一、void*指针使用时不同编译器下的处理结果 二、void*指针传递的指针变量进行位运算时,一定要注意强制转换的类型,和值的取值范围 总结 前言 众所周知,void* 指针作为函数形参时,表示可以接受任意类型的参数&#xf…

C语言基础知识点(十七)结构体中只用指针来存储字符串

// 如果需要用结构存储字符串&#xff0c;用字符数组作为成员会比较简单 // 如果需要使用指向char的指针来进行存储&#xff0c;那么需要请求malloc来 // 为字符串分配合适的存储空间#include <stdio.h> #include <string.h> //提供strcpy()\strlen()的原型 #i…

Linux修改Redis密码

方法一&#xff1a;修改配置文件 找到Redis配置文件redis.conf&#xff0c;通常位于/etc/redis/或/usr/local/etc/目录 sudo vim /etc/redis/redis.conf找到requirepass指令&#xff0c;如果已经有这个指令&#xff0c;你可以直接修改密码&#xff0c;如果没有&#xff0c;添…

Python实战:上下文管理器与with语句

一、引言 在Python编程中&#xff0c;上下文管理器与with语句是实现资源高效管理的重要工具。当程序使用资源&#xff08;如文件、网络连接等&#xff09;时&#xff0c;我们需要确保这些资源在使用完毕后能够被正确地释放&#xff0c;以避免资源泄漏和程序崩溃。上下文管理器…

基于FFmpeg混流及录制rtmp直播流

1、什么是混流&#xff1f; 混流就是把多路音视频流合成单流。准确的说&#xff0c;混流应该叫做混音&#xff08;音频流&#xff09;混画面&#xff08;视频流&#xff09; 混流的过程包括解码、混流、编码和推流四个部分。混流这个环节包括做抖动缓冲&#xff0c;目的是把多…

GDPU Java 天码行空4

文章目录 一、实验目的二、实验内容及要求三、实验内容及要求1. 设计AnimalTool工具类&#xff0c;实现eat()函数多态性&#x1f496; AnimalDemo.java&#x1f338; 运行结果 2. 是猫是狗&#x1f496; DuoTaiDemo5.java&#x1f338; 运行结果 3. 太会了&#x1f496; DuoTai…

国内IP地址切换排行榜软件大全

随着互联网的飞速发展&#xff0c;IP地址切换技术在日常工作和生活中扮演着越来越重要的角色。无论是为了网络安全、访问特定地区网站&#xff0c;还是进行市场调研、网络爬虫等&#xff0c;IP地址切换都成为了不可或缺的工具。虎观代理将为您介绍国内较受欢迎的IP地址切换软件…

B004-springcloud alibaba 服务容错 Sentinel

目录 高并发带来的问题服务雪崩效应常见容错方案常见的容错思路隔离超时限流熔断降级 常见的容错组件 Sentinel入门什么是Sentinel微服务项目集成Sentinel核心库安装Sentinel控制台实现一个接口的限流 Sentinel的概念和功能基本概念重要功能 Sentinel规则流控规则三种流控模式三…

mybatis拦截器打印sql日志

前言 利用mybatis拦截器打印输出sql 操作 编写拦截器 package com.it2.excel01.interceptor;import java.text.DateFormat; import java.util.Date; import java.util.List; import java.util.Locale; import java.util.Properties;import lombok.extern.slf4j.Slf4j; impo…

深度学习——线性代数相关知识

线性代数基础知识 一、线性代数基础知识1、标量2、向量3、矩阵4、张量5、点积6、向量—矩阵积7、矩阵—矩阵乘法 二、小结 一、线性代数基础知识 本节将介绍简要地回顾一下部分基本线性代数内容&#xff0c;线性代数中的基本数学对象、算术和运算&#xff0c;并用数学符号和相…