CN111966336A - 一种基于vue与可视化图形操作的页面生成方法及装置 - Google Patents

一种基于vue与可视化图形操作的页面生成方法及装置 Download PDF

Info

Publication number
CN111966336A
CN111966336A CN202010723577.0A CN202010723577A CN111966336A CN 111966336 A CN111966336 A CN 111966336A CN 202010723577 A CN202010723577 A CN 202010723577A CN 111966336 A CN111966336 A CN 111966336A
Authority
CN
China
Prior art keywords
vue
component
page
parameter information
configuration parameter
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Withdrawn
Application number
CN202010723577.0A
Other languages
English (en)
Inventor
崔守佳
谭博
贾少龙
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Suzhou Inspur Intelligent Technology Co Ltd
Original Assignee
Suzhou Inspur Intelligent Technology Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Suzhou Inspur Intelligent Technology Co Ltd filed Critical Suzhou Inspur Intelligent Technology Co Ltd
Priority to CN202010723577.0A priority Critical patent/CN111966336A/zh
Publication of CN111966336A publication Critical patent/CN111966336A/zh
Withdrawn legal-status Critical Current

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/30—Creation or generation of source code
    • G06F8/31—Programming languages or programming paradigms
    • G06F8/315—Object-oriented languages
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/30—Creation or generation of source code
    • G06F8/34—Graphical or visual programming
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/30—Creation or generation of source code
    • G06F8/38—Creation or generation of source code for implementing user interfaces

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • General Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • Computing Systems (AREA)
  • Management, Administration, Business Operations System, And Electronic Commerce (AREA)

Abstract

本发明为了现有技术中存在的问题，创新提出了一种基于VUE与可视化图形操作的页面生成方法，改变了前端开发的传统编码方式，而是让用户(即前端研发人员)通过界面上的图形化操作，直接拼装VUE组件，并以表单形式为VUE组件及其内部的各HTML元素配置属性、样式、事件等参数，根据组件关系树自上而下逐层获取各个VUE组件的VUE组件代码，合并优化生成VUE项目代码，本发明还提出了一种基于VUE与可视化图形操作的页面生成装置，有效解决由于现有技术中工具不能应用于VUE项目前端开发、组件开发等的问题，有效的提高了前端开发的效率。

Description

一种基于VUE与可视化图形操作的页面生成方法及装置
技术领域
本发明涉及页面生成领域，尤其是涉及一种基于VUE与可视化图形操作的页面生成方法及装置。
背景技术
近几年，随着VUE(一套用于构建用户界面的渐进式JAVASCRIPT框架)、HTML5(一种用来开发页面的超文本标记语言)、CSS3(一种用来表现HTML等文件样式的计算机语言)等前端技术的快速发展，各公司争相提升产品的美观程度、用户体验以及功能的丰富程度，对前端开发人才的关注度不断升温。虽有不少人调整技术方向投入到前端行业，但前端技术迭代较快，且涉及知识面相对宽泛，导致学习成本较高，也造成目前前端市场优质研发人才稀缺的现象，严重影响了团队的前端开发效率。随着前后端分离开发模式的提出与盛行，对前端开发效率的提升更加迫切。如何降低前端开发的门槛，进而让每个开发人员都能轻易参与前端开发任务，并准确实现前端需求。
现有的平台解决案例中，如Dreamweaver(集网页制作和管理网站于一身的网页代码编辑器软件)，仅能通过一些现有HTML元素进行组合拼装出一个静态的HTML页面Demo(示例)，以及为其配置简单样式和JAVASCRIPT(一种具有函数优先的轻量级，解释型或即时编译型的高级编程语言)脚本。
但是现有Dreamweaver并不能用于VUE项目的前端开发、组件开发、以及高效的内部数据交互，开发效率也不高。
发明内容
本发明为了解决现有技术中存在的问题，创新提出了一种基于VUE与可视化图形操作的页面生成方法及装置，有效解决由于现有技术中工具不能应用于VUE项目前端开发、组件开发等的问题，有效的提高了前端开发的效率。
本发明第一方面提供了一种基于VUE与可视化图形操作的页面生成方法，包括：
在可视化操作页面进行图形化操作，拼装VUE组件，并进行VUE组件和VUE组件中的页面元素的配置，将配置参数信息传递给组件解析模块；
接收传递的配置参数信息，并根据配置参数信息，解析生成对应的VUE组件代码；
根据配置参数信息生成组件关系树，所述组件关系树用于记录多个VUE组件之间应用关系；
根据组件关系树自上而下逐层获取各个VUE组件的VUE组件代码，合并优化生成VUE项目代码。
可选地，所述配置信息包括VUE组件配置信息以及页面元素配置信息，所述VUE组件配置信息包括：VUE组件名、VUE组件ID、变量名、函数名、生命周期、数据操作，所述页面元素配置信息包括页面元素节点属性、节点CSS样式、与VUE界面绑定的事件。
可选地，根据配置参数信息生成组件关系树，所述组件关系树用于记录多个VUE组件之间应用关系包括：
接收并存储生成的VUE组件代码；
将传递的配置参数信息转换为可视化数据源，并进行存储；
根据可视化数据源生成组件关系树。
进一步地，根据可视化数据源生成组件关系树具体是：根据可视化数据源中的VUE组件的ID生成组件关系树。
进一步地，所述组件关系树中仅有一个根组件，剩余VUE组件为子组件，根组件支持引用子组件，子组件之间支持相互引用。
可选地，所述组件关系树支持实时更新。
可选地，根据组件关系树自上而下逐层获取各个VUE组件的VUE组件代码之前，还包括：
根据组件关系树从上往下逐层读取存储的配置参数信息以及对应的VUE组件代码，并将配置参数信息以及对应的VUE组件代码在可视化图形操作页面进行展示。
本发明第二方面提供了一种基于VUE与可视化图形操作的页面生成装置，基于本发明第一方面所述的基于VUE与可视化图形操作的页面生成方法基础上实现的，包括：
可视化操作页面模块，在可视化操作页面进行图形化操作，拼装VUE组件，并进行VUE组件和VUE组件中的页面元素的配置，传递配置参数信息；
组件解析模块，接收可视化操作页面模块传递的配置参数信息，并根据配置参数信息，解析生成对应的VUE组件代码；
组件寄存模块，根据配置参数信息生成组件关系树，所述组件关系树用于记录多个VUE组件之间应用关系；
代码生成优化模块，根据组件关系树自上而下逐层获取各个VUE组件的VUE组件代码，合并优化生成VUE项目代码。
可选地，还包括：
组件读取模块，根据组件关系树从上往下逐层读取存储的配置参数信息以及对应的VUE组件代码，并将配置参数信息以及对应的VUE组件代码在可视化图形操作页面进行展示。
本发明采用的技术方案包括以下技术效果：
1、本发明有效解决由于现有技术中工具不能应用于VUE项目前端开发、组件开发等的问题，有效的提高了前端开发的效率。
2、本发明改变了前端开发的传统编码方式，而是让用户(即前端研发人员)通过界面上的图形化操作，直接拼装VUE组件，并以表单形式为VUE组件及其内部的各HTML元素配置属性、样式、事件等参数，并最终编译、合并生成完整的VUE项目代码，操作简单，降低了前端开发人员的学习成本，缩短开发周期，提高开发效率，又能保证VUE项目代码高性能、高质量、高复用。
3、本发明代根据组件寄存模块中组件关系树自上而下逐层获取各个VUE组件的VUE组件代码，合并优化生成VUE项目代码，降低了VUE组件代码的冗余，提高了VUE组件代码的使用效率。
4、本发明技术方案中组件关系树支持实时更新，可以根据VUE组件引用关系的变化进行实时更新，提高了开发效率，降低了VUE组件代码的冗余，保证了VUE项目代码高性能、高质量、高复用。
5、本发明技术方案中根据组件关系树从上往下逐层读取存储的配置参数信息以及对应的VUE组件代码，并将配置参数信息以及对应的VUE组件代码在可视化图形操作页面进行展示，便于用户在可视化操作界面进行预览VUE组件展示效果。
应当理解的是以上的一般描述以及后文的细节描述仅是示例性和解释性的，并不能限制本发明。
附图说明
为了更清楚说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单介绍，显而易见的，对于本领域普通技术人员而言，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
图1为本发明方案中实施例一方法的流程示意图；
图2为本发明方案中实施例一方法中步骤S1的流程示意图；
图3为本发明方案中实施例一方法中步骤S2的流程示意图；
图4为本发明方案中实施例一方法中步骤S3的流程示意图；
图5为本发明方案中实施例一组件应用关系及对应组件关系树的示例示意图；
图6为本发明方案中实施例二方法的流程结构示意图；
图7为本发明方案中实施例二方法中步骤S4的流程示意图；
图8为本发明方案中实施例三装置的结构示意图；
图9为本发明方案中实施例四装置的结构示意图。
具体实施方式
为能清楚说明本方案的技术特点，下面通过具体实施方式，并结合其附图，对本发明进行详细阐述。下文的公开提供了许多不同的实施例或例子用来实现本发明的不同结构。为了简化本发明的公开，下文中对特定例子的部件和设置进行描述。此外，本发明可以在不同例子中重复参考数字和/或字母。这种重复是为了简化和清楚的目的，其本身不指示所讨论各种实施例和/或设置之间的关系。应当注意，在附图中所图示的部件不一定按比例绘制。本发明省略了对公知组件和处理技术及工艺的描述以避免不必要地限制本发明。
实施例一
如图1所示，本发明提供了一种基于VUE与可视化图形操作的页面生成方法，包括：
S1，在可视化操作页面进行图形化操作，拼装VUE组件，并进行VUE组件和VUE组件中的页面元素的配置，传递配置参数信息；
S2，接收传递的配置参数信息，并根据配置参数信息，解析生成对应的VUE组件代码；
S3，根据配置参数信息生成组件关系树，所述组件关系树用于记录多个VUE组件之间应用关系；
S4，根据组件关系树自上而下逐层获取各个VUE组件的VUE组件代码，合并优化生成VUE项目代码。
其中，如图2所示，在步骤S1具体包括：
S11，在可视化操作页面进行图形化操作，拼装VUE组件；
S12，进行VUE组件和VUE组件中的页面元素的配置，传递配置参数信息；
S13，预览拼装的VUE组件展示效果。
在步骤S11中，在用户拼装VUE组件的图形化操作中，可以基于可视化图形化操作技术，例如D3(Data driver documnet，一种基于SVG(可缩放矢量图形)技术的数据驱动图形页面可视化工具)等，提供画布(HTML页面矩形区域)，便于用户在画布中进行VUE组件拼装的图形化操作，常用的HTML页面元素的图形选项包括pannel(面板)、form(拼装)、button(存储按键)等。
在步骤S12中，对VUE组件和VUE组件中的页面元素的配置，传递配置参数信息传递，具体地，配置信息包括VUE组件配置信息以及页面元素配置信息，VUE组件配置信息包括：VUE组件名、VUE组件ID、变量名、函数名、生命周期、数据操作，页面元素配置信息包括页面元素节点属性、节点CSS样式、与VUE界面绑定的JAVASCIRIPT事件等，如果当前页面元素需要调用后台接口，则先指定访问的接口路径，在上传接口返回数据的JSON(Java ScriptObjectNotation，一种轻量级的数据交换格式，其简洁和清晰的层次结构使得JSON成为理想的数据交换语言，易于开发人员的阅读和编写，同时也易于机器解析和生成，能够有效地提升网络传输效率)文件，用于模拟请求。用户可以从可视化操作页面中提供的HTML页面元素图形列表中选择需要拼装使用的页面元素，并将其拖入画布中，在页面元素配置信息表单中进行页面元素信息的配置；点击保存按钮，传递当前配置的配置参数信息，并进行保存。
在步骤S13中，传递配置参数信息后，用户可以预览拼装的VUE组件展示效果，便于用户在第一时间即可预览保存后的VUE组件展示效果。
如图3所示，在步骤S2中，具体包括：
S21，根据页面元素配置信息中每个节点类型的不同，将节点映射生成HTML对应的页面元素标签，并根据节点的页面元素配置信息，为页面元素标签添加属性以及CSS样式、绑定JAVASCIRIPT交互事件(JAVASCIRIPT交互事件与VUE界面绑定)；
S22，根据配置参数信息，解析生成对应的VUE组件代码，并将解析生成对应的VUE组件代码进行存储。
如图4所示，步骤S3具体包括：
S31，接收并存储生成的VUE组件代码；
S32，将传递的配置参数信息转换为可视化数据源，并进行存储；
S33，根据可视化数据源生成组件关系树。
步骤S32中，将传递的配置参数信息转换为可视化数据源，其中可视化数据源为转换后的配置参数信息可以进行可视化操作且能够保存到数据库中，仅是进行数据格式的转换，并进行存储，具体地，可以通过持久化工具Mysql实现。
步骤S33中，根据可视化数据源生成组件关系树具体是：根据可视化数据源中的VUE组件的ID生成组件关系树。
组件关系树中有且仅有一个根组件，剩余VUE组件为子组件，根组件支持引用子组件，子组件之间支持相互引用；具体地，根组件的ID最小，在步骤S1、步骤S2等执行过程中，如果组件之间应用关系发生改变，组件关系树也会相应实时更新。组件关系树可以是数据表的形式进行存储以及更新，本发明在此不做限制。如图5所示，本发明给出了一种示例性的组件引用关系以及对应的组件关系树，也可以根据组件引用关系以及变化，进行相应更新或变化，本发明在此不做限制。
步骤S4中，根据组件关系树自上而下逐层获取步骤S3中存储的各个VUE组件的VUE组件代码，合并优化生成VUE项目代码，本发明中合并优化主要是去除各个VUE组件的VUE组件代码中的重复部分，以降低VUE项目代码的冗余，提升VUE组件的复用性。具体的实现可以通过代码合并工具实现，也可以通过程序语言编程实现，本发明在此不做限制。
需要说明的是，本发明实施例中步骤S1、步骤S2、步骤S3、步骤S4可以通过程序语言编程实现，其实现思路与本实施例中的执行步骤相对应，也可以是通过其他方式实现，本发明实施例在此不做限制。
本发明有效解决由于现有技术中工具不能应用于VUE项目前端开发、组件开发等的问题，有效的提高了前端开发的效率。
本发明改变了前端开发的传统编码方式，而是让用户(即前端研发人员)通过界面上的图形化操作，直接拼装VUE组件，并以表单形式为VUE组件及其内部的各HTML元素配置属性、样式、事件等参数，并最终编译、合并生成完整的VUE项目代码，操作简单，降低了前端开发人员的学习成本，缩短开发周期，提高开发效率，又能保证VUE项目代码高性能、高质量、高复用。
本发明根据组件关系树自上而下逐层获取各个VUE组件的VUE组件代码，合并优化生成VUE项目代码，降低了VUE组件代码的冗余，提高了VUE组件代码的使用效率。
本发明技术方案中组件关系树支持实时更新，可以根据VUE组件引用关系的变化进行实时更新，提高了开发效率，降低了VUE组件代码的冗余，保证了VUE项目代码高性能、高质量、高复用。
实施例二
如图6所示，本发明技术方案还提供了一种基于VUE与可视化图形操作的页面生成方法，包括：
S1，在可视化操作页面进行图形化操作，拼装VUE组件，并进行VUE组件和VUE组件中的页面元素的配置，传递配置参数信息；
S2，接收传递的配置参数信息，并根据配置参数信息，解析生成对应的VUE组件代码；
S3，根据配置参数信息生成组件关系树，所述组件关系树用于记录多个VUE组件之间应用关系；
S4，根据组件关系树从上往下逐层读取存储的配置参数信息以及对应的VUE组件代码，并将配置参数信息以及对应的VUE组件代码在可视化图形操作页面进行展示；
S5，根据组件关系树自上而下逐层获取各个VUE组件的VUE组件代码，合并优化生成VUE项目代码。
其中，如图7所示，步骤S4中，具体包括：
S41，用户从页面组成元素的图形列表里选定一个已保存的拼装VUE组件；
S42，读取组件参数信息，包括配置参数信息以及解析后生成的VUE代码等信息；其中，配置参数信息具体是经过转换后的可视化数据源；
S43，基于可视化图形操作技术展示到可视化操作页面的画布中；
S44，用户点击预览时，将解析后生成的VUE代码进行编译并渲染到可视化操作页面中，便于用户进行预览。
需要说明的是，本发明实施例中步骤S1、步骤S2、步骤S3、步骤S4、步骤S5可以通过程序语言编程实现，其实现思路与本实施例中执行步骤相对应，也可以是通过其他方式实现，本发明实施例在此不做限制。
本发明技术方案中根据组件关系树从上往下逐层读取存储的配置参数信息以及对应的VUE组件代码，并将配置参数信息以及对应的VUE组件代码在可视化图形操作页面进行展示，便于用户在可视化操作界面进行预览VUE组件展示效果。
实施例三
如图8所示，本发明技术方案还提供了一种基于VUE与可视化图形操作的页面生成装置，包括：
可视化操作页面模块11，在可视化操作页面进行图形化操作，拼装VUE组件，并进行VUE组件和VUE组件中的页面元素的配置，传递配置参数信息；
组件解析模块12，接收传递的配置参数信息，并根据配置参数信息，解析生成对应的VUE组件代码；
组件寄存模块13，根据配置参数信息生成组件关系树，所述组件关系树用于记录多个VUE组件之间应用关系；
,代码生成优化模块14，根据组件寄存模块中组件关系树自上而下逐层获取各个VUE组件的VUE组件代码，合并优化生成VUE项目代码。
本发明有效解决由于现有技术中工具不能应用于VUE项目前端开发、组件开发等的问题，有效的提高了前端开发的效率。
本发明改变了前端开发的传统编码方式，而是让用户(即前端研发人员)通过界面上的图形化操作，直接拼装VUE组件，并以表单形式为VUE组件及其内部的各HTML元素配置属性、样式、事件等参数，并最终编译、合并生成完整的VUE项目代码，操作简单，降低了前端开发人员的学习成本，缩短开发周期，提高开发效率，又能保证VUE项目代码高性能、高质量、高复用。
本发明代码生成优化模块根据组件寄存模块中组件关系树自上而下逐层获取各个VUE组件的VUE组件代码，合并优化生成VUE项目代码，降低了VUE组件代码的冗余，提高了VUE组件代码的使用效率。
本发明技术方案中组件关系树支持实时更新，可以根据VUE组件引用关系的变化进行实时更新，提高了开发效率，降低了VUE组件代码的冗余，保证了VUE项目代码高性能、高质量、高复用。
实施例四
如图9所示，本发明技术方案还提供了一种基于VUE与可视化图形操作的页面生成方法，基于实施例一或实施例二中的基于VUE与可视化图形操作的页面生成装置基础上实现的，包括：
可视化操作页面模块11，在可视化操作页面进行图形化操作，拼装VUE组件，并进行VUE组件和VUE组件中的页面元素的配置，传递配置参数信息；
组件解析模块12，接收传递的配置参数信息，并根据配置参数信息，解析生成对应的VUE组件代码；
组件寄存模块13，根据配置参数信息生成组件关系树，所述组件关系树用于记录多个VUE组件之间应用关系；
组件读取模块14，根据组件关系树从上往下逐层读取存储的配置参数信息以及对应的VUE组件代码，并将配置参数信息以及对应的VUE组件代码在可视化图形操作页面进行展示；
代码生成优化模块15，根据组件寄存模块中组件关系树自上而下逐层获取各个VUE组件的VUE组件代码，合并优化生成VUE项目代码。
本发明技术方案中组件读取模块根据组件关系树从上往下逐层读取组件寄存模块模块中存储的配置参数信息以及对应的VUE组件代码，并将配置参数信息以及对应的VUE组件代码在可视化图形操作模块进行展示，便于用户在可视化操作界面进行预览VUE组件展示效果。
上述虽然结合附图对本发明的具体实施方式进行了描述，但并非对本发明保护范围的限制，所属领域技术人员应该明白，在本发明的技术方案的基础上，本领域技术人员不需要付出创造性劳动即可做出的各种修改或变形仍在本发明的保护范围以内。

Claims (9)

1.一种基于VUE与可视化图形操作的页面生成方法，其特征是，包括：
在可视化操作页面进行图形化操作，拼装VUE组件，并进行VUE组件和VUE组件中的页面元素的配置，传递配置参数信息；
接收传递的配置参数信息，并根据配置参数信息，解析生成对应的VUE组件代码；
根据配置参数信息生成组件关系树，所述组件关系树用于记录多个VUE组件之间应用关系；
根据组件关系树自上而下逐层获取各个VUE组件的VUE组件代码，合并优化生成VUE项目代码。
2.根据权利要求1所述的基于VUE与可视化图形操作的页面生成方法，其特征是，所述配置信息包括VUE组件配置信息以及页面元素配置信息，所述VUE组件配置信息包括：VUE组件名、VUE组件ID、变量名、函数名、生命周期、数据操作，所述页面元素配置信息包括页面元素节点属性、节点CSS样式、与VUE界面绑定的事件。
3.根据权利要求1所述的基于VUE与可视化图形操作的页面生成方法，其特征是，根据配置参数信息生成组件关系树，所述组件关系树用于记录多个VUE组件之间应用关系包括：
接收并存储生成的VUE组件代码；
将传递的配置参数信息转换为可视化数据源，并进行存储；
根据可视化数据源生成组件关系树。
4.根据权利要求3所述的基于VUE与可视化图形操作的页面生成方法，其特征是，根据可视化数据源生成组件关系树具体是：根据可视化数据源中的VUE组件的ID生成组件关系树。
5.根据权利要求4所述的基于VUE与可视化图形操作的页面生成方法，其特征是，所述组件关系树中仅有一个根组件，剩余VUE组件为子组件，根组件支持引用子组件，子组件之间支持相互引用。
6.根据权利要求1-5任一所述的基于VUE与可视化图形操作的页面生成方法，其特征是，所述组件关系树支持实时更新。
7.根据权利要求1所述的基于VUE与可视化图形操作的页面生成方法，其特征是，根据组件关系树自上而下逐层获取各个VUE组件的VUE组件代码之前，还包括：
根据组件关系树从上往下逐层读取存储的配置参数信息以及对应的VUE组件代码，并将配置参数信息以及对应的VUE组件代码在可视化图形操作页面进行展示。
8.一种基于VUE与可视化图形操作的页面生成装置，其特征是，基于权利要求1-7任一所述的基于VUE与可视化图形操作的页面生成方法基础上实现的，包括：
可视化操作页面模块，在可视化操作页面进行图形化操作，拼装VUE组件，并进行VUE组件和VUE组件中的页面元素的配置，传递配置参数信息；
组件解析模块，接收可视化操作页面模块传递的配置参数信息，并根据配置参数信息，解析生成对应的VUE组件代码；
组件寄存模块，根据配置参数信息生成组件关系树，所述组件关系树用于记录多个VUE组件之间应用关系；
代码生成优化模块，根据组件关系树自上而下逐层获取各个VUE组件的VUE组件代码，合并优化生成VUE项目代码。
9.根据权利要求8所述的基于VUE与可视化图形操作的页面生成装置，其特征是，还包括：
组件读取模块，根据组件关系树从上往下逐层读取存储的配置参数信息以及对应的VUE组件代码，并将配置参数信息以及对应的VUE组件代码在可视化图形操作页面进行展示。
CN202010723577.0A 2020-07-24 2020-07-24 一种基于vue与可视化图形操作的页面生成方法及装置 Withdrawn CN111966336A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202010723577.0A CN111966336A (zh) 2020-07-24 2020-07-24 一种基于vue与可视化图形操作的页面生成方法及装置

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202010723577.0A CN111966336A (zh) 2020-07-24 2020-07-24 一种基于vue与可视化图形操作的页面生成方法及装置

Publications (1)

Publication Number Publication Date
CN111966336A true CN111966336A (zh) 2020-11-20

Family

ID=73362934

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202010723577.0A Withdrawn CN111966336A (zh) 2020-07-24 2020-07-24 一种基于vue与可视化图形操作的页面生成方法及装置

Country Status (1)

Country Link
CN (1) CN111966336A (zh)

Cited By (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN112445477A (zh) * 2020-12-09 2021-03-05 浙江源创建筑智能科技有限公司 一种基于Vue的组件可视化系统及方法
CN112527288A (zh) * 2021-02-10 2021-03-19 北京宇信科技集团股份有限公司 可生成代码的可视化系统原型设计方法、系统及存储介质
CN113110828A (zh) * 2021-04-19 2021-07-13 中国工商银行股份有限公司 前端原型调试方法及装置
CN113835701A (zh) * 2021-09-22 2021-12-24 上海妙一生物科技有限公司 一种基于组件化的代码生成方法和装置
CN114461210A (zh) * 2021-12-27 2022-05-10 深圳市金证科技股份有限公司 基于vue组件化页面开发方法、装置、设备及存储介质
WO2022141724A1 (zh) * 2020-12-31 2022-07-07 南威软件股份有限公司 基于 Vue 组件化的可视化配置渲染方法、系统、终端
CN117591117A (zh) * 2024-01-19 2024-02-23 中建三局信息科技有限公司 页面生成方法、系统、设备及存储介质

Cited By (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN112445477A (zh) * 2020-12-09 2021-03-05 浙江源创建筑智能科技有限公司 一种基于Vue的组件可视化系统及方法
WO2022141724A1 (zh) * 2020-12-31 2022-07-07 南威软件股份有限公司 基于 Vue 组件化的可视化配置渲染方法、系统、终端
CN112527288A (zh) * 2021-02-10 2021-03-19 北京宇信科技集团股份有限公司 可生成代码的可视化系统原型设计方法、系统及存储介质
CN113110828A (zh) * 2021-04-19 2021-07-13 中国工商银行股份有限公司 前端原型调试方法及装置
CN113835701A (zh) * 2021-09-22 2021-12-24 上海妙一生物科技有限公司 一种基于组件化的代码生成方法和装置
CN113835701B (zh) * 2021-09-22 2024-04-02 上海妙一生物科技有限公司 一种基于组件化的代码生成方法和装置
CN114461210A (zh) * 2021-12-27 2022-05-10 深圳市金证科技股份有限公司 基于vue组件化页面开发方法、装置、设备及存储介质
CN117591117A (zh) * 2024-01-19 2024-02-23 中建三局信息科技有限公司 页面生成方法、系统、设备及存储介质
CN117591117B (zh) * 2024-01-19 2024-04-23 中建三局信息科技有限公司 页面生成方法、系统、设备及存储介质

Similar Documents

Publication Publication Date Title
CN111966336A (zh) 一种基于vue与可视化图形操作的页面生成方法及装置
Rivero et al. Mockup-driven development: providing agile support for model-driven web engineering
US7793258B2 (en) Software development using visual interfaces
EP2151773B1 (en) Synchronous to asynchronous web page conversion
Aghaee et al. End-user development of mashups with naturalmash
US8589877B2 (en) Modeling and linking documents for packaged software application configuration
Robles Luna et al. WebSpec: a visual language for specifying interaction and navigation requirements in web applications
KR101951719B1 (ko) 그래픽 인터페이스 기반으로 이벤트 동작을 프로그래밍 하는 웹 레포팅 디자인 시스템
Heitkötter et al. Cross-platform development of business apps with MD 2
CN110609681A (zh) 可视化配置生成web应用的系统、方法、设备及介质
US20020066074A1 (en) Method and system for developing and executing software applications at an abstract design level
CN114564199A (zh) 一种生成使用页面的方法、装置、设备及可读存储介质
US20080229253A1 (en) Method, System and Computer Program for Navigating UML Diagrams
US20130191809A1 (en) Graphical representation of an order of operations
Urbieta et al. MDWA: a model-driven Web augmentation approach—coping with client-and server-side support
Urbieta et al. A web-based model-driven platform for web augmentation
KR101730070B1 (ko) ＳａａＳ 환경에서의 웹페이지 서비스 방법, 이를 위한 컴퓨터 프로그램, 그 기록매체
Bocciarelli et al. Automated development of web-based modeling services for MSaaS platforms.
Benson Mockup driven web development
CN113849257A (zh) 页面处理方法、装置、介质及电子设备
CN114356291A (zh) 基于配置文件生成表单的方法、装置、设备及介质
Atanasova et al. Transforming concur task trees model into an abstract user interface
Efendioglu et al. Modelling method design: An adoxx realisation
Sharma et al. Analyzing the difference between ReactJS and AngularJS
Jansen Exploring interactive application landscape visualizations based on low-code automation

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
WW01 Invention patent application withdrawn after publication
WW01 Invention patent application withdrawn after publication

Application publication date: 20201120