[發明專利]一種適合配置型表單頁面的布局方法

在審

• 申請號: 201910971353.9
• 申請日: 2019-10-14
• 公開（公告）號: CN110825471A
• 公開（公告）日: 2020-02-21
• 發明（設計）人: 白溪陽;方科;李升琴;張開棒;趙巍
• 申請（專利權）人: 紫光云（南京）數字技術有限公司
• 主分類號: G06F9/451
• 分類號: G06F9/451;G06F16/958
• 代理公司: 暫無信息
• 代理人: 暫無信息

本發明公開了一種適合配置型表單頁面的布局方法，涉及互聯網技術領域。本發明包括在布局系統中選擇預定義好的表單布局模版，由用戶根據需要選擇表單的布局并配置相應的表單元素，從而構成一張表單；獲取表單元素數據信息，并根據表單元素數據信息自動匹配生成每個表單元素渲染的方式；對配置的表單元素進行相應的渲染；生成表單畫面，顯示表單畫面。本發明為配置型表單提供了簡單靈活的布局方式；對于表單元素的新增、刪除非常友好，不需要改變其他元素的布局，各元素之間的布局沒有耦合性。

技術領域

本發明屬于技術領域，特別是涉及一種適合配置型表單頁面的布局方法。

背景技術

瀏覽器表單頁面是一種比較常見的頁面類型。瀏覽器的表單通常是由 html,js,css組成，html主要負責繪制頁面布局，表單元素，js用于監聽事件，動態頁面效果，發送請求等頁面邏輯。Css用于頁面樣式調整。

在同一個項目里面，我們一般會使用一套風格的表單元素去開發。在一些前端主流框架中(vue,react，angular等)，我們一般會通過組件的形式吧表單組件的封裝好，在寫代碼的時候關注點就在于頁面布局，組件配置和js邏輯。Js邏輯包括組件之間的聯動，表單初始化，提交等。在不考慮布局和組件聯動情況下，通過json配置的方式生成表單，相對是比較簡單的。現有的瀏覽器表單頁面存在布局不靈活，同時不能通過簡單配置適配任意使用場景的缺點。

發明內容

本發明的目的在于提供一種適合配置型表單頁面的布局方法，以解決背景技術中提到的問題。

為解決上述技術問題，本發明是通過以下技術方案實現的：

本發明為一種適合配置型表單頁面的布局方法，包括：

S01、在布局系統中選擇預定義好的表單布局模版，由用戶根據需要選擇表單的布局并配置相應的表單元素，從而構成一張表單；

S02、獲取表單元素數據信息，并根據表單元素數據信息自動匹配生成每個表單元素渲染的方式；

S03、對配置的表單元素進行相應的渲染；

S04、生成表單畫面，顯示表單畫面。

進一步地，所述表單元素包括columnNumber、colspan、rowspan；

所述columnNumber表示列號，所述colspan表示所占列數，所述rowspan 所占行數。

進一步地，所述S01中表單布局模版預定義具體包括：

從預先設置的組件庫中獲取多個目標組件；

根據預先設置的布局規則和多個所述目標組件，生成頁面模板；

根據所述頁面模板，生成包括多個所述目標組件的頁面。

進一步地，所述布局規則包括位置規則、類型規則和數量規則。

本發明具有以下有益效果：

本發明為配置型表單提供了簡單靈活的布局方式；對于表單元素的新增、刪除非常友好，不需要改變其他元素的布局，各元素之間的布局沒有耦合性。

當然，實施本發明的任一產品并不一定需要同時達到以上所述的所有優點。

附圖說明

為了更清楚地說明本發明實施例的技術方案，下面將對實施例描述所需要使用的附圖作簡單地介紹，顯而易見地，下面描述中的附圖僅僅是本發明的一些實施例，對于本領域普通技術人員來講，在不付出創造性勞動的前提下，還可以根據這些附圖獲得其他的附圖。

圖1為本發明實施例1表單頁面布局圖。

具體實施方式