CN110427233A - Back-end data binding method, device, electronic equipment and storage medium - Google Patents
Back-end data binding method, device, electronic equipment and storage medium Download PDFInfo
- Publication number
- CN110427233A CN110427233A CN201910563717.XA CN201910563717A CN110427233A CN 110427233 A CN110427233 A CN 110427233A CN 201910563717 A CN201910563717 A CN 201910563717A CN 110427233 A CN110427233 A CN 110427233A
- Authority
- CN
- China
- Prior art keywords
- data field
- module
- end data
- binding
- background system
- 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.)
- Pending
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/451—Execution arrangements for user interfaces
Abstract
The embodiment of the present disclosure provides a kind of back-end data binding method, device and mobile terminal.The described method includes: parsing to preconfigured UI design document, UI element to be configured is obtained；Obtain back-end data field corresponding with the UI element to be configured；Establish the binding relationship between the UI element to be configured and the back-end data field.The embodiment of the present disclosure not only realizes the binding of front end UI element and back-end data, can also realize the interaction between front end UI element and back-end data.
Description
Technical field
Embodiment of the disclosure is related to UI processing technology of interface field more particularly to a kind of back-end data binding method, dress
It sets, electronic equipment and storage medium.
Background technique
UI (User Interface, user interface) design (or interface) refers to human-computer interaction to software, behaviour
The whole design for making logic, beautiful interface, is also interface.
With the development of science and technology, smart phone, pad (tablet computer), the terminals such as smart television are used widely, user
Requirement to terminal is higher and higher, and carrying out terminal custom becomes a kind of trend, for example, user can be according to oneself demand to terminal
UI be customized.
But when passing through UI code access background system, customized unity and coherence in writing data model PDM is usually depended on
(Product Data Management, product data management) file generates " table " object of access background system, i.e., in PDM
Front and back code is saved in file, still, is bound and is handed over by the data that DPM file can not complete front end UI and back-end system
Mutually.
Summary of the invention
Embodiment of the disclosure provides a kind of back-end data binding method, device, electronic equipment and storage medium, to reality
The data of existing front end UI and back-end system tie up fixed sum data interaction.
It is according to an embodiment of the present disclosure in a first aspect, providing a kind of back-end data binding method, comprising:
Preconfigured UI design document is parsed, UI element to be configured is obtained；
Obtain back-end data field corresponding with the UI element to be configured；
Establish the binding relationship between the UI element to be configured and the back-end data field.
Optionally, acquisition back-end data field corresponding with the UI element to be configured, comprising:
Obtain UI module corresponding with the UI element to be configured；
Configure the UI module back office interface corresponding with background system address；
According to the back office interface address, receive by the background system return it is corresponding with the UI element to be configured after
Platform data field.
Optionally, described according to the back office interface address, it receives and is returned and the UI to be configured by the background system
The corresponding back-end data field of element, comprising:
According to the back office interface address, the multiple data fields returned by the background system are received；
The UI element to be configured is parsed；
According to parsing result, rear number of units corresponding with the UI element to be configured is selected from the multiple data field
According to field.
Optionally, the binding relationship established between the UI element to be configured and the back-end data field it
Afterwards, further includes:
Based on the UI element to be configured and the binding relationship, UI module to be configured is determined；
Generate UI code corresponding with the UI module to be configured.
Optionally, generation UI code corresponding with the UI module to be configured, comprising:
According to the corresponding parsing result of the UI design document, layout letter corresponding with the UI module to be configured is obtained
Breath；
Based on the layout information, the UI element to be configured and the back-end data field, generate with it is described to be configured
The corresponding UI code of UI module.
Second aspect according to an embodiment of the present disclosure provides a kind of back-end data binding device, comprising:
UI element obtains module and obtains UI element to be configured for parsing to preconfigured UI design document；
Data field obtains module, for obtaining back-end data field corresponding with the UI element to be configured；
Binding relationship establishes module, the binding for establishing between the UI element to be configured and the back-end data field
Relationship.
Optionally, the data field acquisition module includes:
UI module acquisition submodule, for obtaining UI module corresponding with the UI element to be configured；
Interface IP address configures submodule, for configuring the UI module back office interface corresponding with background system address；
Data field receiving submodule, for according to the back office interface address, receive by the background system return with
The corresponding back-end data field of the UI element to be configured.
Optionally, the data field receiving submodule includes:
Multi-field receiving submodule, for according to the back office interface address, reception to be returned more by the background system
A data field；
UI element analyzing sub-module, for being parsed to the UI element to be configured；
Data field selects submodule, for according to parsing result, selected from the multiple data field with it is described
The corresponding back-end data field of UI element to be configured.
Optionally, further includes:
UI determining module to be configured determines UI to be configured for being based on the UI element to be configured and the binding relationship
Module；
UI code generation module, for generating UI code corresponding with the UI module to be configured.
Optionally, the UI code generation module includes:
Layout information acquisition submodule, for according to the corresponding parsing result of the UI design document, obtain with it is described to
Configure the corresponding layout information of UI module；
UI code building submodule, for being based on the layout information, the UI element to be configured and the back-end data
Field generates UI code corresponding with the UI module to be configured.
The third aspect according to an embodiment of the present disclosure, provides a kind of electronic equipment, comprising: processor, memory with
And it is stored in the computer program that can be run on the memory and on the processor, which is characterized in that the processor
Said one or multiple back-end data binding methods are realized when executing described program.
Fourth aspect according to an embodiment of the present disclosure provides a kind of readable storage medium storing program for executing, when in the storage medium
Instruction when being executed by the processor of electronic equipment so that electronic equipment is able to carry out said one or multiple rear number of units
According to binding method.
Embodiment of the disclosure provides a kind of back-end data binding scheme, by preconfigured UI design document into
Row parsing, obtains UI element to be configured, obtains back-end data field corresponding with UI element to be configured, and establishes UI member to be configured
Binding relationship between element and back-end data field.The embodiment of the present disclosure is by by UI element to be configured and corresponding back-end data
Field is bound, and the binding of front end UI element and back-end data is not only realized, and can also realize front end UI element and backstage
Interaction between data.
Detailed description of the invention
In order to illustrate more clearly of the technical solution of embodiment of the disclosure, below by the description to embodiment of the disclosure
Needed in attached drawing be briefly described, it should be apparent that, the accompanying drawings in the following description is only the implementation of the disclosure
Some embodiments of example for those of ordinary skill in the art without any creative labor, can be with
It obtains other drawings based on these drawings.
Fig. 1 is a kind of step flow chart for back-end data binding method that the embodiment of the present disclosure provides；
Fig. 2 is a kind of step flow chart for back-end data binding method that the embodiment of the present disclosure provides；
Fig. 2 a is a kind of schematic diagram for data binding process that the embodiment of the present disclosure provides；
Fig. 2 b is a kind of schematic diagram for template configuration that the embodiment of the present disclosure provides；
Fig. 2 c is a kind of schematic diagram for acquisition UI element that the embodiment of the present disclosure provides；
Fig. 2 d is the schematic diagram that a kind of pair of UI element that the embodiment of the present disclosure provides is configured；
Fig. 2 e is the schematic diagram of a kind of UI element that the embodiment of the present disclosure provides and back-end data binding；
Fig. 3 is a kind of structural schematic diagram for back-end data binding device that the embodiment of the present disclosure provides；
Fig. 4 is a kind of structural schematic diagram for rear day data binding device that the embodiment of the present disclosure provides.
Specific embodiment
Below in conjunction with the attached drawing in embodiment of the disclosure, the technical solution in embodiment of the disclosure is carried out clear
Chu is fully described by, it is clear that described embodiment is embodiment of the disclosure a part of the embodiment, rather than whole realities
Apply example.Based on the embodiment in embodiment of the disclosure, those of ordinary skill in the art are not making creative work premise
Under every other embodiment obtained, belong to embodiment of the disclosure protection range.
Embodiment one
Referring to Fig.1, a kind of step flow chart of back-end data binding method of embodiment of the present disclosure offer is shown, specifically
It may include steps of:
Step 101: preconfigured UI design document being parsed, UI element to be configured is obtained.
In the embodiments of the present disclosure, UI design document refers to corresponding by the preconfigured interface UI to be configured of research staff
File, for example, research staff can configure layout information corresponding with the interface UI, text when needing to configure an interface UI
Display information can click the information such as interface button, these information have collectively constituted UI design document.
UI element to be configured refers to the layout element at the interface UI to be configured, and UI element to be configured can have many types, example
Such as, UI element can be card, web interface, head portrait of player etc. in game, the embodiment of the present disclosure to the type of UI element not
It is specifically limited.
It include multiple UI modules in UI design document, UI module, which refers to, divides the interface UI to be configured
Multiple modules may include multiple UI elements to be configured in each UI module, can be substantially by multiple UI elements to be configured
Understand the interface layout at the interface UI to be configured.
After obtaining the preconfigured UI design document of business personnel, preconfigured UI design document can be carried out
Parsing obtains the UI element to be configured for including in UI design document with parsing.
It is to be appreciated that the UI element to be configured in UI design document is usually multiple UI elements to be configured, not only limit
A fixed UI element to be configured.
It is parsed to preconfigured UI design document, after obtaining UI element to be configured, executes step 102.
Step 102: obtaining back-end data field corresponding with the UI element to be configured.
Back-end data field refers to the data field corresponding with UI element to be configured of background system configuration, i.e. back-end data
Field can be used for UI element showing on the interface UI of front end in timeliness.
Business personnel configure UI design document while, i.e., can background system configure in UI design document wait match
The corresponding data field of UI element is set, for example, UI element to be configured includes UIa, UIb and UIc, then can be configured for UIa corresponding
Data field: field 1 configures corresponding data field: field 2 for UIb, and configures corresponding data field: field for UIc
3。
It is to be appreciated that above-mentioned example is merely to more fully understand the technical solution of the embodiment of the present disclosure and showing for enumerating
Example, not as the sole limitation to the embodiment of the present invention.
Certainly, the data field of configuration not only includes the corresponding data field of UI element to be configured, can also include UI circle
The data field for the other information that face is shown and the data field etc. of each UI element to be configured display position.
And after the acquisition platform data field when, can be by the interactive interface of background system and front end, will by background system
All data fields relevant to the interface UI to be configured are sent to front end, by front end from all matches search with to
Configure the corresponding back-end data field of UI element.
Certainly, in the concrete realization, those skilled in the art can also using other way obtain background system in to
The corresponding back-end data field of UI element is configured, the embodiment of the present disclosure does not limit the acquisition modes of back-end data field
System.
After obtaining back-end data field corresponding with UI element to be configured, step 103 is executed.
Step 103: establishing the binding relationship between the UI element to be configured and the back-end data field.
After obtaining UI element to be configured and back-end data field corresponding with UI element to be configured, it can establish wait match
The binding relationship between UI element and corresponding back-end data field is set, after establishing the binding relationship, binding can be closed
System saves to front end,, can be directly according to binding relationship from background system when running some UI element thus in late stage
Corresponding back-end data field is searched, to run the application logic that back-end data field realizes the interface front end UI.
Certainly, in the embodiments of the present disclosure, in addition to need to establish UI element to be configured and corresponding back-end data field it
Between binding relationship outside, the interface IP address between front end and background system can also be obtained, can be realized by the interface IP address
Data exchange process.
Front end UI element can be realized by binding front end UI element with back-end data field in the embodiment of the present disclosure
Data between back-end data field are bound and are interacted.
The back-end data binding method that embodiment of the disclosure provides, by being solved to preconfigured UI design document
Analysis, obtains UI element to be configured, obtains back-end data field corresponding with UI element to be configured, and establish UI element to be configured and
Binding relationship between back-end data field.The embodiment of the present disclosure is by by UI element to be configured and corresponding back-end data field
It is bound, not only realizes the binding of front end UI element and back-end data, can also realize front end UI element and back-end data
Between interaction.
Embodiment two
Referring to Fig. 2, a kind of step flow chart of back-end data binding method of embodiment of the present disclosure offer is shown, specifically
It may include steps of:
Step 201: preconfigured UI design document being parsed, UI element to be configured is obtained.
In the embodiments of the present disclosure, UI design document refers to corresponding by the preconfigured interface UI to be configured of research staff
File, for example, research staff can configure layout information corresponding with the interface UI, text when needing to configure an interface UI
Display information can click the information such as interface button, these information have collectively constituted UI design document.
When needing to carry out the binding of back-end data field to preconfigured UI design document, a mould can be pre-configured with
Plate, the API (Application that definition template title, token (project for needing to bind) and needs call in a template
Programming Interface, application programming interface) etc., for example, referring to Fig. 2 b, shows the embodiment of the present disclosure and mention
A kind of schematic diagram of the template configuration supplied, as shown in Figure 2 b, the template name of configuration are as follows: " HTKOversea Test ", PortM
Group token: " 4e346c4a-180a-4b1b-bb4d-07414b149719 " selects API: "/betacat/
OverseaRecommend ", whiteboard data type: "/betacat/overseaRecommend ", also, shown in the page
It is shown with " immediately create " and the " Cancel " button, after click " creates " button immediately, corresponding configuration template can be created, and
When clicking the " Cancel " button, that is, cancel the creation of the configuration template.
UI element to be configured refers to the layout element at the interface UI to be configured, and UI element to be configured can have many types, example
Such as, UI element can be card, web interface, head portrait of player etc. in game, the embodiment of the present disclosure to the type of UI element not
It is specifically limited.
It include multiple UI modules in UI design document, UI module, which refers to, divides the interface UI to be configured
Multiple modules may include multiple UI elements to be configured in each UI module, can be substantially by multiple UI elements to be configured
Understand the interface layout at the interface UI to be configured.
After parsing to UI design document, available UI module wherein included is selected by business personnel in turn
The UI module for needing to parse is selected, available UI element to be configured shows embodiment of the present disclosure offer for example, referring to Fig. 2 c
A kind of acquisition UI element schematic diagram, " Tokyo Xinsu Washington hotel ", " the big wine of Tokyo Japan bridge Xi Siting shown in Fig. 2 c
Shop ", " Tokyo Xinsu Washington hotel " can be respectively as three UI modules, in Fig. 2 c, " the Tokyo Xinsu Washington of top side
Hotel " can be used as the UI module of business personnel's selection, available as shown in Fig. 2 c right half part after being parsed
" current block: HTKOverseaTsetModule ", " GPI Type:NearbyRscommendResponse ", " API Name:
AotuName ", " URL:/betacat/overseaRecommend " ..., by being solved to current block (i.e. UI module)
Analysis, it is available to corresponding multiple UI elements to be configured.
It is to be appreciated that the UI element to be configured in UI design document is usually multiple UI elements to be configured, not only limit
A fixed UI element to be configured.
Certainly, after parsing obtains UI element to be configured, UI element to be configured can also be configured, such as configures UI
The name of element, type (such as label (label), image (image), textiput (control title after extension)), for example, ginseng
According to Fig. 2 d, the schematic diagram that a kind of pair of UI element of embodiment of the present disclosure offer is configured is shown, it is as shown in Figure 2 d, to be configured
The control of UI element " rising " is entitled " priceSuffix ".
It is to be appreciated that above-mentioned example is merely to more fully understand the technical solution of the embodiment of the present disclosure and showing for enumerating
Example, not as the sole limitation to the embodiment of the present disclosure.
After obtaining UI element to be configured, step 202 is executed.
Step 202: obtaining UI module corresponding with the UI element to be configured.
It is parsed to all UI modules in UI design document, it, can be with after obtaining whole UI elements to be configured
UI module corresponding to each UI element to be configured is obtained respectively, i.e., UI module belonging to each UI element to be configured.
Specifically, after being parsed to UI module, the UI element and UI to be configured that parsing UI module can be obtained
Module is associated, and records the incidence relation, can know UI module corresponding to UI element to be configured according to record result.
After obtaining UI module corresponding with UI element to be configured, step 203 is executed.
Step 203: configuring the UI module back office interface corresponding with background system address.
In the embodiments of the present disclosure, different UI modules can correspond to different back office interface addresses, back office interface
Location is to refer to that front end UI module obtains the address for the data field that background system is sent, for example, UI module includes UI modules A and UI
Module B, UI modules A interface IP address corresponding with background system are as follows: address 1, and UI module B interface corresponding with background system
Location are as follows: address 2.
Certainly, different UI modules may correspond to the same back office interface address, for example, in above-mentioned example, UI mould
Block further includes that UI module C, UI modules A and UI module C correspond to same back office interface address, i.e. address 1.
After obtaining corresponding with UI element to be configured UI module, can configure UI module it is corresponding with background system after
Platform interface IP address be the path of UI module configuration is " API.data.item.... ", the path for example, as shown in Figure 2 d
Think the interface IP address day after tomorrow corresponding with background system of UI module configuration.
After configuring UI module back office interface corresponding with background system address, step 204 is executed.
Step 204: according to the back office interface address, receiving and returned and the UI element to be configured by the background system
Corresponding back-end data field.
After configuring UI module back office interface corresponding with background system address, by being received by back office interface address
The back-end data field corresponding with element to be configured returned by background system, for example, UI module includes module 1 and module 2, mould
Block 1 includes UI element 1, UI element 2 and UI element 3, and UI module includes UI element 4 and UI element 5, module 1 and background system pair
The back office interface address answered is address a, and back office interface corresponding with the background system address of module 2 is address b, then is needing to obtain
When the back-end data field for the UI element that module 1 includes, it can be obtained respectively by address a from background system and UI element 1, UI
Element 2 and the corresponding back-end data field of UI element 3；And in the back-end data field for needing to obtain the UI element that module 2 includes
When, back-end data field corresponding with UI element 4 and UI element 5 can be obtained respectively from background system by address b.
And it is as shown in Figure 2 d, be UI module configuration path be " API.data.item.... ", which can be for UI
The interface IP address day after tomorrow corresponding with background system of module configuration, when obtaining back-end data field from background system, Ke Yitong
It crosses path " API.data.item.... " and obtains corresponding back-end data field.
It is to be appreciated that above-mentioned example is merely to more fully understand the technical solution of the embodiment of the present disclosure and showing for enumerating
Example, not as the sole limitation to the embodiment of the present disclosure.
Certainly, the back-end data field corresponding with UI module obtained from background system can include some redundant fields, this
UI element to be configured can be parsed in open embodiment, to obtain required back-end data field, specifically, with following
Specific implementation is described in detail.
In a kind of preferred embodiment of the disclosure, above-mentioned steps 204 may include:
Sub-step A1: according to the back office interface address, the multiple data fields returned by the background system are received.
In the embodiments of the present disclosure, multiple data fields refer to whole data field corresponding with UI module.In UI mould
It can also include other UI interface informations in block other than comprising UI element to be configured, such as the position at the interface UI, each UI element
Size etc..
After configuring back office interface corresponding with background system address for UI module, background system can be by connecing from the background
Port address forward end returns to multiple data fields corresponding with UI module, for example, as shown in Figure 2 d, background system can pass through road
Diameter " API.data.item.... " forward end returns to all data fields corresponding with UI module.
Front end system can receive the multiple numbers corresponding with UI module returned by background system by back office interface address
According to field, in turn, sub-step A2 is executed.
Sub-step A2: the UI element to be configured is parsed.
After receiving the multiple data fields returned by background system, UI element to be configured can be carried out by front end
Parsing can know which data field UI element to be configured corresponds to by parsing to UI element to be configured.
After parsing to UI element to be configured, sub-step A3 is executed.
Sub-step A3: it according to parsing result, is selected from the multiple data field and the UI element pair to be configured
The back-end data field answered.
After parsing to UI element to be configured, it can know which data field UI element to be configured corresponds to,
In turn, back-end data field corresponding with UI element to be configured can be selected from multiple data fields, for example, UI to be configured
Element includes UI element 1 and UI element 2, after parsing to UI element 1, can learn the corresponding rear number of units of UI element 1
It is field a according to field；And after being parsed to UI element 2, it can learn that the corresponding back-end data field of UI element 2 is word
Section b can select field a corresponding with UI element 1 according to parsing result, with UI element in turn from multiple data fields
2 corresponding field b.
It is to be appreciated that above-mentioned example is merely to more fully understand the technical solution of the embodiment of the present disclosure and showing for enumerating
Example, not as the sole limitation to the embodiment of the present disclosure.
Certainly, above-mentioned specific implementation is only that a kind of acquisition UI element to be configured that the embodiment of the present disclosure is enumerated is corresponding
The preferred embodiment of back-end data field, in the concrete realization, those skilled in the art can also be obtained using other way wait match
The corresponding back-end data field of UI element is set, specifically, can be depending on business demand, the embodiment of the present disclosure no longer adds herein
To repeat.
According to back office interface address, receives and back-end data field corresponding with UI element to be configured is returned to by background system
Later, step 205 is executed.
Step 205: establishing the binding relationship between the UI element to be configured and the back-end data field.
After obtaining UI element to be configured and back-end data field corresponding with UI element to be configured, it can establish wait match
The binding relationship between UI element and corresponding back-end data field is set, after establishing the binding relationship, binding can be closed
System saves to front end,, can be directly according to binding relationship from background system when running some UI element thus in late stage
Corresponding back-end data field is searched, to run the application logic that back-end data field realizes the interface front end UI, for example, referring to figure
2e shows a kind of UI element of embodiment of the present disclosure offer and the schematic diagram of back-end data binding, as shown in Figure 2 e, UI element
" good: 4.0 points " corresponding label is entitled " scoreText ", also, arranges in Fig. 2 e shown with " data binding ", ties up in data
Shown with the data field of UI element binding in fixed column, such as " scoreText-String " is also set after each UI element certainly
It is equipped with " deletion " button, when not needing the binding of the UI element and back-end data field, can be clicked and " be deleted by business personnel
Except " button, the binding relationship between the UI element and back-end data field can be deleted.
It is to be appreciated that above-mentioned example is merely to more fully understand the technical solution of the embodiment of the present disclosure and showing for enumerating
Example, not as the sole limitation to the embodiment of the present disclosure.
Certainly, in the embodiments of the present disclosure, in addition to need to establish UI element to be configured and corresponding back-end data field it
Between binding relationship outside, the interface IP address between front end and background system can also be obtained, can be realized by the interface IP address
Data exchange process.
After the binding relationship established between UI element to be configured and back-end data field, step 206 is executed.
Step 206: being based on the UI element to be configured and the binding relationship, determine UI module to be configured.
UI module to be configured refers to the UI module that will be used to configure the interface UI.
It, can be based on UI member to be configured after the binding relationship established between UI element to be configured and back-end data field
Element and binding relationship, determine UI module to be configured, for example, UI module includes UI element 1 and UI element 2, after UI element 1 is corresponding
Platform data field is field a, and the corresponding back-end data field of UI element 2 is field b, is being established between UI element 1 and field a
After binding relationship between binding relationship and UI element 2 and field b, 2 and of UI element 1 and field a, UI element can be based on
Field b collectively constitutes UI module to be configured.
It is to be appreciated that above-mentioned example is merely to more fully understand the technical solution of the embodiment of the present disclosure and showing for enumerating
Example, not as the sole limitation to the embodiment of the present disclosure.
It is being based on UI element to be configured and binding relationship, after determining UI module to be configured, is executing step 207.
Step 207: generating UI code corresponding with the UI module to be configured.
UI code refers to that UI code corresponding with UI module to be configured, UI code can be used to implement the display at the interface UI,
The layout size of the text information, button and each button that are shown in such as interface UI.
After determining UI module to be configured, can according to UI module to be configured, obtained from UI design document with wait match
The corresponding UI code of UI module is set, specifically, the scheme for generating UI code is referred to retouching for following specific implementations
It states.
The disclosure one kind in the specific implementation, above-mentioned steps 207 may include:
Sub-step B1: it according to the corresponding parsing result of the UI design document, obtains corresponding with the UI module to be configured
Layout information.
In the embodiments of the present disclosure, parsing result refers to UI design document is parsed after obtained from result.
The layout information for preserving business personnel in UI design document in advance and be the configuration of UI module, as UI module is rendering
The information such as display size of each UI element in the location of interface UI of generation and UI module.
After obtaining the corresponding parsing result of UI design document, it can be obtained according to parsing result and UI module to be configured
Corresponding layout information, and execute sub-step B2.
Sub-step B2: the layout information, the UI element to be configured and the back-end data field, generation and institute are based on
State the corresponding UI code of UI module to be configured.
After obtaining the corresponding layout information of UI module to be configured, can according to UI module to be configured layout information,
UI element to be configured and back-end data field corresponding with UI element to be configured, generate UI module to be configured corresponding UI generation jointly
Code.
After generating UI code corresponding with UI module to be configured, rendering parsing can be carried out to UI code, to generate
The interface UI of business personnel's configuration.
When clicking some UI element in the interface UI, the interaction with back-end data field may be implemented, that is, before realizing
Hold the data exchange process of UI and background system.
Next, the back-end data binding scheme provided the embodiment of the present disclosure is described below in conjunction with Fig. 2 a.
Referring to Fig. 2 a, a kind of schematic diagram of data binding process of embodiment of the present disclosure offer is shown, as shown in Figure 2 a,
The available object module of UI design document configured by business personnel, i.e. data configuration module (i.e. UI mould in Fig. 2 a
Block), then data configuration module is parsed, obtains UI element to be configured therein, and solve to UI element to be configured
Analysis name etc., can be generated intermediate data description, as ViewModel (view model) include: LabelText1,
LabelText2, ImageUrl1, ImageUrl2, Model include: Text1, Text2, Url1, Url2, wherein
LabelText1 corresponds to Text1, and LabelText2 corresponds to Text2, and ImageUrl1 corresponds to Url1, and ImageUrl2 is corresponding
In Url2.Generate intermediate data description after, that is, produce UI module to be configured, according to intermediate data description can be generated to
Configure the corresponding service code of UI module.Data configuration module can also be from NetHawk (background system Code automatic build system
System) obtain corresponding back-end data field.After generating service code, it can establish view model, i.e. View (view),
ViewModel (view model), Model (data model) generate back-end data corresponding with data configuration module in NetHawk
After field, the back-end data field of generation can be sent to PortM (back office interface management system) by NetHawk, in turn,
Back-end data field corresponding with data configuration module is returned to by PortM.In turn, UI element to be configured and rear number of units be can establish
According to the binding relationship between field, the data between front end UI and background system may be implemented and bind and interact.
The back-end data binding method that embodiment of the disclosure provides, by being solved to preconfigured UI design document
Analysis, obtains UI element to be configured, obtains back-end data field corresponding with UI element to be configured, and establish UI element to be configured and
Binding relationship between back-end data field.The embodiment of the present disclosure is by by UI element to be configured and corresponding back-end data field
It is bound, not only realizes the binding of front end UI element and back-end data, can also realize front end UI element and back-end data
Between interaction.
Embodiment three
Referring to Fig. 3, a kind of structural schematic diagram of back-end data binding device of embodiment of the present disclosure offer is shown, specifically
May include following module:
UI element obtains module 310, for parsing to preconfigured UI design document, obtains UI member to be configured
Element；
Data field obtains module 320, for obtaining back-end data field corresponding with the UI element to be configured；
Binding relationship establishes module 330, for establishing between the UI element to be configured and the back-end data field
Binding relationship.
The back-end data binding device that embodiment of the disclosure provides, by being solved to preconfigured UI design document
Analysis, obtains UI element to be configured, obtains back-end data field corresponding with UI element to be configured, and establish UI element to be configured and
Binding relationship between back-end data field.The embodiment of the present disclosure is by by UI element to be configured and corresponding back-end data field
It is bound, not only realizes the binding of front end UI element and back-end data, can also realize front end UI element and back-end data
Between interaction.
Example IV
Referring to Fig. 4, a kind of structural schematic diagram of back-end data binding device of embodiment of the present disclosure offer is shown, specifically
May include following module:
UI element obtains module 410, for parsing to preconfigured UI design document, obtains UI member to be configured
Element；
Data field obtains module 420, for obtaining back-end data field corresponding with the UI element to be configured；
Binding relationship establishes module 430, for establishing between the UI element to be configured and the back-end data field
Binding relationship；
UI determining module 440 to be configured determines to be configured for being based on the UI element to be configured and the binding relationship
UI module；
UI code generation module 450, for generating UI code corresponding with the UI module to be configured.
Optionally, the data field acquisition module 420 includes:
UI module acquisition submodule 421, for obtaining UI module corresponding with the UI element to be configured；
Interface IP address configures submodule 422, for configuring the UI module back office interface corresponding with background system address；
Data field receiving submodule 423, for according to the back office interface address, reception to be returned by the background system
Back-end data field corresponding with the UI element to be configured.
Optionally, the data field receiving submodule 423 includes:
Multi-field receiving submodule, for according to the back office interface address, reception to be returned more by the background system
A data field；
UI element analyzing sub-module, for being parsed to the UI element to be configured；
Data field selects submodule, for according to parsing result, selected from the multiple data field with it is described
The corresponding back-end data field of UI element to be configured.
Optionally, the UI code generation module 450 includes:
Layout information acquisition submodule, for according to the corresponding parsing result of the UI design document, obtain with it is described to
Configure the corresponding layout information of UI module；
UI code building submodule, for being based on the layout information, the UI element to be configured and the back-end data
Field generates UI code corresponding with the UI module to be configured.
The back-end data binding device that embodiment of the disclosure provides, by being solved to preconfigured UI design document
Analysis, obtains UI element to be configured, obtains back-end data field corresponding with UI element to be configured, and establish UI element to be configured and
Binding relationship between back-end data field.The embodiment of the present disclosure is by by UI element to be configured and corresponding back-end data field
It is bound, not only realizes the binding of front end UI element and back-end data, can also realize front end UI element and back-end data
Between interaction.
The back-end data binding device that embodiment of the disclosure provides, by being solved to preconfigured UI design document
Analysis, obtains UI element to be configured, obtains back-end data field corresponding with UI element to be configured, and establish UI element to be configured and
Binding relationship between back-end data field.The embodiment of the present disclosure is by by UI element to be configured and corresponding back-end data field
It is bound, not only realizes the binding of front end UI element and back-end data, can also realize front end UI element and back-end data
Between interaction.
Embodiment of the disclosure additionally provides a kind of electronic equipment, comprising: processor, memory and is stored in described deposit
On reservoir and the computer program that can run on the processor, the processor realize aforementioned implementation when executing described program
The back-end data binding method of example.
Embodiment of the disclosure additionally provides a kind of readable storage medium storing program for executing, when the instruction in the storage medium is set by electronics
When standby processor executes, so that electronic equipment is able to carry out the back-end data binding method of previous embodiment.
For device embodiment, since it is basically similar to the method embodiment, related so being described relatively simple
Place illustrates referring to the part of embodiment of the method.
Algorithm and display are not inherently related to any particular computer, virtual system, or other device provided herein.
Various general-purpose systems can also be used together with teachings based herein.As described above, it constructs required by this kind of system
Structure be obvious.In addition, embodiment of the disclosure is also not for any particular programming language.It should be understood that can be with
The content of embodiment of the disclosure described herein is realized using various programming languages, and is retouched above to what language-specific was done
Stating is preferred forms in order to disclose embodiment of the disclosure.
In the instructions provided here, numerous specific details are set forth.It is to be appreciated, however, that the implementation of the disclosure
Example can be practiced without these specific details.In some instances, well known method, structure is not been shown in detail
And technology, so as not to obscure the understanding of this specification.
Similarly, it should be understood that in order to simplify the disclosure and help to understand one or more of the various inventive aspects, In
Above in the description of the exemplary embodiment of the disclosure, each feature of embodiment of the disclosure is grouped together into list sometimes
In a embodiment, figure or descriptions thereof.However, the disclosed method should not be interpreted as reflecting the following intention: i.e. institute
Claimed embodiment of the disclosure requires features more more than feature expressly recited in each claim.More really
It says with cutting, as reflected in the following claims, inventive aspect is less than single embodiment disclosed above
All features.Therefore, it then follows thus claims of specific embodiment are expressly incorporated in the specific embodiment, wherein often
A claim itself is all as the separate embodiments of embodiment of the disclosure.
Those skilled in the art will understand that can be carried out adaptively to the module in the equipment in embodiment
Change and they are arranged in one or more devices different from this embodiment.It can be the module or list in embodiment
Member or component are combined into a module or unit or component, and furthermore they can be divided into multiple submodule or subelement or
Sub-component.Other than such feature and/or at least some of process or unit exclude each other, it can use any
Combination is to all features disclosed in this specification (including adjoint claim, abstract and attached drawing) and so disclosed
All process or units of what method or apparatus are combined.Unless expressly stated otherwise, this specification is (including adjoint power
Benefit requires, abstract and attached drawing) disclosed in each feature can be by providing identical, equivalent, or similar purpose alternative features come generation
It replaces.
The various component embodiments of embodiment of the disclosure can be implemented in hardware, or in one or more processing
The software module run on device is realized, or is implemented in a combination thereof.It will be understood by those of skill in the art that can be in reality
Trample the middle life that dynamic picture according to an embodiment of the present disclosure is realized using microprocessor or digital signal processor (DSP)
The some or all functions of some or all components in forming apparatus.Embodiment of the disclosure is also implemented as holding
Some or all device or device programs of row method as described herein.Such realization embodiment of the disclosure
Program can store on a computer-readable medium, or may be in the form of one or more signals.Such letter
It number can be downloaded from an internet website to obtain, be perhaps provided on the carrier signal or be provided in any other form.
It should be noted that above-described embodiment illustrates rather than to embodiment of the disclosure embodiment of the disclosure
It is limited, and those skilled in the art can be designed replacement without departing from the scope of the appended claims and implement
Example.In the claims, any reference symbol between parentheses should not be configured to limitations on claims.Word
"comprising" does not exclude the presence of element or step not listed in the claims.Word "a" or "an" located in front of the element is not
There are multiple such elements for exclusion.Embodiment of the disclosure can be by means of including the hardware of several different elements and borrowing
Help properly programmed computer to realize.In the unit claims listing several devices, several in these devices
A can be is embodied by the same item of hardware.The use of word first, second, and third does not indicate any suitable
Sequence.These words can be construed to title.
It is apparent to those skilled in the art that for convenience and simplicity of description, the system of foregoing description,
The specific work process of device and unit, can refer to corresponding processes in the foregoing method embodiment, and details are not described herein.
The foregoing is merely the preferred embodiments of embodiment of the disclosure, not to limit the implementation of the disclosure
Example, all made any modifications, equivalent replacements, and improvements etc. within the spirit and principle of embodiment of the disclosure should all include
Within the protection scope of embodiment of the disclosure.
The above, the only specific embodiment of embodiment of the disclosure, but the protection scope of embodiment of the disclosure
It is not limited thereto, anyone skilled in the art, can in the technical scope that embodiment of the disclosure discloses
Change or replacement are readily occurred in, should all be covered within the protection scope of embodiment of the disclosure.Therefore, embodiment of the disclosure
Protection scope should be subject to the protection scope in claims.
Claims (10)
1. a kind of back-end data binding method characterized by comprising
Preconfigured UI design document is parsed, UI element to be configured is obtained；
Obtain back-end data field corresponding with the UI element to be configured；
Establish the binding relationship between the UI element to be configured and the back-end data field.
2. the method according to claim 1, wherein acquisition backstage corresponding with the UI element to be configured
Data field, comprising:
Obtain UI module corresponding with the UI element to be configured；
Configure the UI module back office interface corresponding with background system address；
According to the back office interface address, receives and rear number of units corresponding with the UI element to be configured is returned to by the background system
According to field.
3. according to the method described in claim 2, reception is by described it is characterized in that, described according to the back office interface address
Background system returns to back-end data field corresponding with the UI element to be configured, comprising:
According to the back office interface address, the multiple data fields returned by the background system are received；
The UI element to be configured is parsed；
According to parsing result, back-end data word corresponding with the UI element to be configured is selected from the multiple data field
Section.
4. the method according to claim 1, wherein establishing the UI element to be configured and the backstage described
After binding relationship between data field, further includes:
Based on the UI element to be configured and the binding relationship, UI module to be configured is determined；
Generate UI code corresponding with the UI module to be configured.
5. according to the method described in claim 4, it is characterized in that, generation UI generation corresponding with the UI module to be configured
Code, comprising:
According to the corresponding parsing result of the UI design document, layout information corresponding with the UI module to be configured is obtained；
Based on the layout information, the UI element to be configured and the back-end data field, generate and the UI mould to be configured
The corresponding UI code of block.
6. a kind of back-end data binding device characterized by comprising
UI element obtains module and obtains UI element to be configured for parsing to preconfigured UI design document；
Data field obtains module, for obtaining back-end data field corresponding with the UI element to be configured；
Binding relationship establishes module, and the binding for establishing between the UI element to be configured and the back-end data field is closed
System.
7. device according to claim 6, which is characterized in that the data field obtains module and includes:
UI module acquisition submodule, for obtaining UI module corresponding with the UI element to be configured；
Interface IP address configures submodule, for configuring the UI module back office interface corresponding with background system address；
Data field receiving submodule, for according to the back office interface address, receive by the background system return with it is described
The corresponding back-end data field of UI element to be configured.
8. device according to claim 7, which is characterized in that the data field receiving submodule includes:
Multi-field receiving submodule, for receiving the multiple numbers returned by the background system according to the back office interface address
According to field；
UI element analyzing sub-module, for being parsed to the UI element to be configured；
Data field selects submodule, for being selected from the multiple data field with described wait match according to parsing result
Set the corresponding back-end data field of UI element.
9. a kind of electronic equipment characterized by comprising
Processor, memory and it is stored in the computer program that can be run on the memory and on the processor,
It is characterized in that, the processor realizes the back-end data as described in one or more in claim 1 to 5 when executing described program
Binding method.
10. a kind of readable storage medium storing program for executing, which is characterized in that when the instruction in the storage medium is held by the processor of electronic equipment
When row, so that electronic equipment is able to carry out the back-end data binding side as described in one or more in claim to a method 1 to 5
Method.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201910563717.XA CN110427233A (en) | 2019-06-26 | 2019-06-26 | Back-end data binding method, device, electronic equipment and storage medium |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201910563717.XA CN110427233A (en) | 2019-06-26 | 2019-06-26 | Back-end data binding method, device, electronic equipment and storage medium |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN110427233A true CN110427233A (en) | 2019-11-08 |
Family
ID=68409742
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201910563717.XA Pending CN110427233A (en) | 2019-06-26 | 2019-06-26 | Back-end data binding method, device, electronic equipment and storage medium |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN110427233A (en) |
Citations (17)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| JP2000099372A (en) * | 1998-09-24 | 2000-04-07 | Yamaha Corp | Computer system |
| CN101620533A (en) * | 2009-08-05 | 2010-01-06 | 山东中创软件商用中间件股份有限公司 | Information management method and device |
| CN101661512A (en) * | 2009-09-25 | 2010-03-03 | 万斌 | System and method for identifying traditional form information and establishing corresponding Web form |
| CN102339314A (en) * | 2011-09-24 | 2012-02-01 | 国网电力科学研究院 | Cross-terminal data form description and presentation method based on extensive makeup language (XML) |
| CN102467375A (en) * | 2010-11-09 | 2012-05-23 | 金蝶软件（中国）有限公司 | Method and device for generating client interface |
| CN102495735A (en) * | 2011-12-14 | 2012-06-13 | 方正国际软件有限公司 | Web end UI (user interface) component application frame system |
| CN103677819A (en) * | 2013-12-05 | 2014-03-26 | 深圳中兴网信科技有限公司 | Method and device for achieving code forward engineering based on OSGI |
| CN103942046A (en) * | 2014-04-02 | 2014-07-23 | 云南电网公司 | Unified model developing method based on objects |
| CN104199928A (en) * | 2014-09-03 | 2014-12-10 | 国家电网公司 | Method for describing and analyzing semi-structured pages |
| CN104731594A (en) * | 2015-03-26 | 2015-06-24 | 浪潮集团有限公司 | Method for displaying runtime customized page based on Bootstrap |
| CN105976322A (en) * | 2016-05-12 | 2016-09-28 | 国网辽宁省电力有限公司大连供电公司 | Power grid comprehensive information monitoring graph generation system and method |
| CN107454954A (en) * | 2015-05-27 | 2017-12-08 | 谷歌公司 | Data bind correlation analysis |
| CN107992346A (en) * | 2017-10-19 | 2018-05-04 | 用友网络科技股份有限公司 | Interface display method, the interface display system of application program |
| CN108038212A (en) * | 2017-12-20 | 2018-05-15 | 江苏国泰新点软件有限公司 | A kind of data interactive method, device, system, equipment and storage medium |
| CN108052322A (en) * | 2017-12-29 | 2018-05-18 | 陈菡 | A kind of dragging method based on visual layout's system |
| CN108509395A (en) * | 2017-02-24 | 2018-09-07 | 北京国双科技有限公司 | data binding method and device |
| CN109446092A (en) * | 2018-10-31 | 2019-03-08 | 北京微播视界科技有限公司 | The method, apparatus and electronic equipment be identified to user interface UI element |
-
2019
- 2019-06-26 CN CN201910563717.XA patent/CN110427233A/en active Pending
Patent Citations (17)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| JP2000099372A (en) * | 1998-09-24 | 2000-04-07 | Yamaha Corp | Computer system |
| CN101620533A (en) * | 2009-08-05 | 2010-01-06 | 山东中创软件商用中间件股份有限公司 | Information management method and device |
| CN101661512A (en) * | 2009-09-25 | 2010-03-03 | 万斌 | System and method for identifying traditional form information and establishing corresponding Web form |
| CN102467375A (en) * | 2010-11-09 | 2012-05-23 | 金蝶软件（中国）有限公司 | Method and device for generating client interface |
| CN102339314A (en) * | 2011-09-24 | 2012-02-01 | 国网电力科学研究院 | Cross-terminal data form description and presentation method based on extensive makeup language (XML) |
| CN102495735A (en) * | 2011-12-14 | 2012-06-13 | 方正国际软件有限公司 | Web end UI (user interface) component application frame system |
| CN103677819A (en) * | 2013-12-05 | 2014-03-26 | 深圳中兴网信科技有限公司 | Method and device for achieving code forward engineering based on OSGI |
| CN103942046A (en) * | 2014-04-02 | 2014-07-23 | 云南电网公司 | Unified model developing method based on objects |
| CN104199928A (en) * | 2014-09-03 | 2014-12-10 | 国家电网公司 | Method for describing and analyzing semi-structured pages |
| CN104731594A (en) * | 2015-03-26 | 2015-06-24 | 浪潮集团有限公司 | Method for displaying runtime customized page based on Bootstrap |
| CN107454954A (en) * | 2015-05-27 | 2017-12-08 | 谷歌公司 | Data bind correlation analysis |
| CN105976322A (en) * | 2016-05-12 | 2016-09-28 | 国网辽宁省电力有限公司大连供电公司 | Power grid comprehensive information monitoring graph generation system and method |
| CN108509395A (en) * | 2017-02-24 | 2018-09-07 | 北京国双科技有限公司 | data binding method and device |
| CN107992346A (en) * | 2017-10-19 | 2018-05-04 | 用友网络科技股份有限公司 | Interface display method, the interface display system of application program |
| CN108038212A (en) * | 2017-12-20 | 2018-05-15 | 江苏国泰新点软件有限公司 | A kind of data interactive method, device, system, equipment and storage medium |
| CN108052322A (en) * | 2017-12-29 | 2018-05-18 | 陈菡 | A kind of dragging method based on visual layout's system |
| CN109446092A (en) * | 2018-10-31 | 2019-03-08 | 北京微播视界科技有限公司 | The method, apparatus and electronic equipment be identified to user interface UI element |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| WO2020155778A1 (en) | Interface automation test method, test apparatus, test device and storage medium | |
| CN103377652B (en) | A kind of method, device and equipment for carrying out speech recognition | |
| CN104572960B (en) | A kind of method and device of search | |
| CN108804188A (en) | Changing an interface skin method and device | |
| KR20130115654A (en) | Method of rendering user interface, server performing the same and stroage media sotring the same | |
| CN104090899B (en) | A kind of method and apparatus of feedback display content information | |
| CN108804158A (en) | Application call method, the control method of terminal device, terminal device and computer readable storage medium | |
| CN109190101A (en) | Note reading generation method, device and electronic equipment | |
| CN112133281A (en) | Voice broadcasting method and device, electronic equipment and storage medium | |
| CN105959207A (en) | Audio and video sharing method and device | |
| CN107885767A (en) | A kind of page operation method and device | |
| CN106557300A (en) | A kind of function stack information of wild pointer determines method, device and electronic equipment | |
| CN107818046A (en) | The A/B method of testings and device of the application program page | |
| CN109829123A (en) | A kind of method for sending information and device | |
| CN105094775A (en) | Webpage generation method and apparatus | |
| CN110347946A (en) | A kind of page display method, device, computer equipment and storage medium | |
| CN106648569A (en) | Target serialization achieving method and device | |
| CN106210802A (en) | The method and apparatus that information is issued | |
| CN105847320A (en) | Resource obtaining method and device | |
| CN102508884A (en) | Method and device for acquiring hotpot events and real-time comments | |
| CN105245622A (en) | Configurable data processing method and system and mobile platform | |
| CN108959294A (en) | A kind of method and apparatus accessing search engine | |
| CN110427233A (en) | Back-end data binding method, device, electronic equipment and storage medium | |
| US20130254682A1 (en) | Proxying an active link from a shared computer | |
| CN105009115A (en) | Method and apparatus for obtaining network resources |
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 |