Compound-component processing method and apparatus and device

Abstract

Provided in the embodiments of the present disclosure are a compound-component processing method and apparatus and a device. The method comprises: determining a compound component to be generated, said compound component comprising a target sub-component, and said compound component corresponding to a compound-component creation function; in response to an attribute adding operation for the target sub-component of said compound component, adding each attribute of the target sub-component to input parameters of the compound-component creation function; and furthermore, on the basis of the compound-component creation function and the input parameters of the compound-component creation function, generating a target compound component. Thus, the attribute adding operation allows all attributes of the target sub-component comprised in the target compound component to be exposed at one time. When the target compound component is in use, each attribute of the target sub-component of the target compound component can be subjected to personalized adjustment, thus meeting the requirement for adjusting each attribute of the target sub-component in the target compound component in specific service scenarios.

Description

A composite component processing method, device and equipment

[0001] This application claims priority to Chinese Patent Application No. 202310906341.4 filed on July 21, 2023, and the contents of the above-mentioned Chinese patent application disclosure are hereby incorporated by reference in their entirety as a part of this application. Technical Field

[0002] Embodiments of the present disclosure relate to a method, apparatus, and device for processing composite components. Background Art

[0003] During application development, applications often include multiple pages that can jump to and reference each other, and pages are often composed of multiple components. Atomic components are bottom-level components, single, indivisible components. Composite components, on the other hand, combine and encapsulate multiple atomic components, allowing for rapid reuse across different pages.

[0004] When developing a composite component, you need to set its exposed properties. When using a composite component, only its exposed properties can be edited. Currently, the way exposed properties are set during composite component development means the resulting composite component cannot meet the personalized needs of some business scenarios.

[0005] Summary of the Invention

[0006] In view of this, the present disclosure provides a method, apparatus, and device for processing composite components, so that the generated composite components can meet the personalized needs of specific business scenarios.

[0007] To solve the above problems, the technical solutions provided by the present disclosure are as follows:

[0008] In a first aspect, the present disclosure provides a method for processing a composite component, the method comprising:

[0009] Determine a composite component to be generated; the composite component to be generated includes a target subcomponent, and the composite component to be generated corresponds to a composite component creation function;

[0010] In response to an attribute adding operation on the target subcomponent in the to-be-generated composite component, adding each attribute of the target subcomponent to an input parameter of the composite component creation function;

[0011] A target composite component is generated based on the composite component creation function and the input parameters; wherein each property of the target subcomponent included in the target composite component is editable.

[0012] In a second aspect, the present disclosure provides a composite component processing device, the device comprising:

[0013] A determining unit is configured to determine a composite component to be generated; the composite component to be generated includes a target subcomponent, and the composite component to be generated corresponds to a composite component creation function;

[0014] A first adding unit is configured to, in response to an attribute adding operation on the target subcomponent in the to-be-generated composite component, add each attribute of the target subcomponent to the input parameters of the composite component creation function;

[0015] The first generating unit is configured to generate a target composite component based on the composite component creation function and the input parameters; wherein each property of the target subcomponent included in the target composite component is editable.

[0016] In a third aspect, the present disclosure provides an electronic device, comprising:

[0017] one or more processors;

[0018] a storage device having one or more programs stored thereon,

[0019] When the one or more programs are executed by the one or more processors, the one or more processors implement any of the composite component processing methods.

[0020] In a fourth aspect, the present disclosure provides a computer-readable storage medium having a computer program stored thereon, wherein the computer program, when executed by a processor, implements any of the aforementioned methods for processing composite components. BRIEF DESCRIPTION OF THE DRAWINGS

[0021] FIG1 is a schematic diagram of a framework of an exemplary application scenario provided by an embodiment of the present disclosure;

[0022] FIG2 is a flow chart of a method for processing a composite component provided by an embodiment of the present disclosure;

[0023] FIG3 a is a schematic diagram of the development of a composite component provided by an embodiment of the present disclosure;

[0024] FIG3 b is a schematic diagram of the development of another composite assembly provided by an embodiment of the present disclosure;

[0025] FIG4a is a schematic diagram of a composite assembly provided by an embodiment of the present disclosure;

[0026] FIG4 b is a schematic diagram of another composite assembly provided by an embodiment of the present disclosure;

[0027] FIG4c is a schematic diagram of another composite assembly provided by an embodiment of the present disclosure;

[0028] FIG5a is a schematic diagram of unbinding a composite component provided by an embodiment of the present disclosure;

[0029] FIG5 b is a schematic diagram of an unbinding pop-up window provided in an embodiment of the present disclosure;

[0030] FIG5c is a schematic diagram of unbinding another composite component provided by an embodiment of the present disclosure;

[0031] FIG5 d is a schematic diagram of an unbundled composite component provided by an embodiment of the present disclosure;

[0032] FIG6 a is a schematic structural diagram of a composite component E provided in an embodiment of the present disclosure;

[0033] FIG6 b is a schematic diagram of a page provided by an embodiment of the present disclosure;

[0034] FIG6c is another schematic diagram of a page provided by an embodiment of the present disclosure;

[0035] FIG6 d is another schematic diagram of a page provided by an embodiment of the present disclosure;

[0036] FIG7 is a schematic structural diagram of a composite component processing device provided by an embodiment of the present disclosure;

[0037] FIG8 is a schematic diagram of the basic structure of an electronic device provided by an embodiment of the present disclosure. DETAILED DESCRIPTION

[0038] In order to make the above-mentioned objects, features and advantages of the present disclosure more obvious and easy to understand, the embodiments of the present disclosure are further described in detail below with reference to the accompanying drawings and specific implementation methods.

[0039] In order to facilitate understanding and explanation of the technical solutions provided by the embodiments of the present disclosure, the background technology of the present disclosure will be described below.

[0040] It is understandable that before using the technical solutions of each embodiment of the present disclosure, the type, scope of use, usage scenarios, etc. of the personal information involved will be informed to the user in an appropriate manner, and the user's authorization will be obtained.

[0041] For example, in response to a user's active request, a prompt message is sent to the user to clearly inform the user that the requested operation will require the acquisition and use of the user's personal information. This allows the user to independently choose whether to provide personal information to the electronic device, application, server, storage medium, or other software or hardware that performs the operation of the disclosed technical solution based on the prompt message.

[0042] As an optional but non-limiting implementation, in response to a user's active request, the prompt information may be sent to the user in the form of a pop-up window, in which the prompt information may be presented in text form. Furthermore, the pop-up window may also contain a selection control for the user to select "agree" or "disagree" to provide personal information to the electronic device.

[0043] It is understandable that the above notification and user authorization process are merely illustrative and do not constitute a limitation on the implementation of the present disclosure. Other methods that comply with relevant laws and regulations may also be applied to the implementation of the present disclosure.

[0044] Currently, application building and development can be achieved based on the application building platform service aPaaS. The application building platform service allows users to quickly build applications that meet business needs with little or no development, thereby improving application development efficiency.

[0045] An application consists of multiple application pages (referred to as pages) that can jump to and reference each other. A page is often composed of multiple components, such as a table component for displaying multiple rows of detailed data or a line chart component for displaying data trends. Components within a page are considered part of the page. A component encapsulates a series of UI code, and different components implement different functions through different UI code. Components can be dragged (referenced) to different pages, allowing for reuse across different pages.

[0046] Among them, components can include atomic components and composite components. Atomic components are bottom-level components, also known as basic components. They are single and indivisible components and are the smallest units used to build application pages. Composite components are components that combine and encapsulate multiple atomic components. They can be quickly reused in different pages, greatly improving the efficiency of application construction and reducing service maintenance costs. For example, atomic components can be search components, filtering components, sorting components, empty tables, etc. Composite components are obtained by combining and encapsulating these atomic components. The obtained composite component is an advanced table with table functions, search functions, filtering functions, and sorting functions. Then, users can drag and drop the advanced table to different pages for reuse. It can be understood that composite components and atomic components can be further constructed into more complex composite components.

[0047] Components are upgradeable, allowing component developers to add / update functionality and push it to users. Furthermore, for composite components, when multiple pages use a composite component, or the same composite component is used multiple times on the same page, changes to one composite component will also affect other composite components already added to the page, enabling centralized maintenance of components.

[0048] Components have various properties, and the properties that a component exposes are called custom properties. Specifically, custom properties are a series of input parameters or configuration items that users set for a component, controlling its functionality and meeting various personalized scenario requirements. For example, a button group component can have its display text, icon, color, size, and other features as custom properties. Different custom property configurations for a component result in different functionalities, meeting the needs of various personalized scenarios.

[0049] When developing composite components, you need to set the exposed properties of the composite components (that is, the properties that are open to the outside world). When using composite components, only the exposed properties of the composite components can be edited. The creation of composite components is mainly to solve problems such as reuse and efficiency. Once a composite component is developed, it can be reused many times to help improve the efficiency of application construction. However, the higher the degree of encapsulation and the higher the degree of reuse of the composite component, the more difficult it is to meet the personalized needs of some business scenarios / application scenarios, and it is difficult to balance reuse and personalization. In the development process of composite components, the current way of setting the exposed properties of composite components makes the generated composite components unable to meet the personalized needs of some business scenarios.

[0050] Based on this, the embodiments of the present disclosure provide a method, apparatus and device for processing a composite component to determine the composite component to be generated. The composite component to be generated already includes a target sub-component, and the composite component to be generated corresponds to a composite component creation function. The user can perform an attribute addition operation of the target sub-component of the composite component to be generated, and in response to the attribute addition operation, all attributes of the target sub-component are added to the input parameters of the composite component creation function corresponding to the composite component to be generated. Then, based on the composite component creation function and the input parameters of the composite component creation function, the target composite component is generated. Based on this, all attributes of the target sub-component included in the target composite component are exposed, and when the target composite component is used, all attributes of the target sub-component inside it can be edited. In this way, the present disclosure directly uses the various attributes of the target sub-component as input parameters through the attribute addition operation, and exposes all its attributes at one time based on the entire target sub-component, thereby realizing a one-time adjustment of all attributes of the target sub-component in the composite component to be generated. When using a target composite component, you can personalize and adjust the properties of the target subcomponents in the target composite component, so as to meet the editing requirements of the properties of the target subcomponents in the target composite component in a specific business scenario.

[0051] It is understandable that the defects found in the solutions described in the embodiments of this disclosure are the result of careful practice and research by the discloser. Therefore, the process of discovering the relevant problems and the solutions proposed in the embodiments of this disclosure should be regarded as the discloser's contribution to the embodiments of this disclosure during the disclosure process.

[0052] To facilitate understanding of the composite component processing method provided by the embodiments of the present disclosure, the following description is provided in conjunction with the scenario example shown in Figure 1. Referring to Figure 1, this figure is a schematic diagram of the framework of an exemplary application scenario provided by the embodiments of the present disclosure. The composite component processing method provided by the embodiments of the present disclosure can be applied to any terminal device or server, without limitation herein.

[0053] In actual applications, composite components can be developed in the component editor. The page displayed when the component editor develops a composite component can be called the composite component development page. For example, the first page referred to in the embodiments of the present disclosure. In the process of developing / building a composite component in the component editor, the subcomponents that make up the composite component can be first determined, and the subcomponents can be placed in a container-type component for combination and encapsulation to build the composite component. A container-type component is a component that can accommodate other components internally, such as a table container component.

[0054] The composite component to be generated in the embodiment of the present disclosure is a composite component in the development / building process. At least one subcomponent has been built inside the composite component to be generated, and at least one subcomponent includes a target subcomponent. For example, at least one subcomponent is subcomponent 1 and subcomponent 2, and the target subcomponent is subcomponent 1. Then, subcomponent 1 has been built inside the composite component to be generated in the embodiment of the present disclosure, and subcomponent 2 may or may not have been built. It should be understood that when setting the properties that need to be exposed for the composite component to be generated, it can be done after placing a single subcomponent in a container class component, or after placing all subcomponents in a container class component.

[0055] The components shown in Figure 1 can be understood as subcomponents of a composite component. Each composite component to be generated corresponds to a composite component creation function, which has corresponding input parameters (referred to as input parameters). These input parameters can be understood as the properties that the composite component to be built will expose. Typically, the backend renders the composite component on a page (such as the first page) based on the composite component creation function and its input parameters.

[0056] In the related art, the user can set the input parameters of the composite component to be generated by interacting with the component editor on the front end. Accordingly, the back end will determine the corresponding data type based on the result of the setting, and set the input parameters (i.e., exposed properties) in the composite component creation function according to the data type. Among them, the data type refers to the type of the input parameter. For example, the user selects the button group component (a subcomponent) in the composite component to be generated on the first page of the front end, and sets an exposed property of the composite component to be generated to the text of the button. In response to this operation, the data type of the input parameter is determined to be a text type, that is, the composite component creation function sets the input parameter of text type accordingly. The user sets another exposed property of the composite component to be generated to the width of the button group component (the width is a numerical type) on the first page of the front end, and the composite component creation function sets the input parameter of numerical type accordingly.

[0057] In the embodiment of the present disclosure, on the basis of providing a method of setting input parameters based on data types, a method of setting input parameters based on sub-components is also provided. Specifically, the user can perform a property adding operation on the target sub-component in the composite component to be generated on the first page of the front-end. In response to this operation, the back-end directly adds the various properties of the target sub-component to the input parameters of the composite component creation function. That is, taking the entire target sub-component as a unit, all its properties are added to the input parameters of the composite component creation function at one time. In the embodiment of the present disclosure, this method of setting input parameters can be called sub-component-based input parameters.

[0058] It can be seen that, based on the composite component to be generated, the input parameter setting method based on the sub-component is a method of setting the input parameters of the composite component. At this time, if the input parameters have been set, the back-end will create a function based on the composite component and render the input parameters to obtain the target composite component. In this way, the various properties of the target sub-component included in the target composite component are editable. If it is necessary to be able to edit the various properties of the entire target sub-component in a specific application scenario to meet personalized needs, the sub-component-based input parameter setting method in the embodiment of the present disclosure (that is, all properties of the target sub-component are used as input parameters of the function at one time) can meet the personalized needs of the specific application scenario.

[0059] After the target composite component is generated, it can be used to build a page. For example, by dragging the target composite component into a page, the target composite component can be used as a component of the page.

[0060] Furthermore, as shown in Figure 1, the output of the target composite component can be understood as the display state of the target composite component on the page. For example, if the target composite component includes a button group component, then whether the button group component is currently clicked, currently displayed, or currently hidden, etc., are all display states of the button group component, and are not limited here.

[0061] Those skilled in the art will appreciate that the framework diagram shown in FIG1 is merely an example in which the embodiments of the present disclosure may be implemented, and the scope of application of the embodiments of the present disclosure is not limited in any way by the framework.

[0062] To facilitate understanding of the present disclosure, a method for processing a composite component provided by an embodiment of the present disclosure is described below with reference to the accompanying drawings.

[0063] Referring to FIG. 2 , which is a flow chart of a method for processing a composite component provided by an embodiment of the present disclosure, the method can be implemented by a terminal device or a server. As shown in FIG. 2 , the method may include steps S201-S203 , which are applied in the development process of the composite component and specifically include:

[0064] S201: Determine the composite component to be generated; the composite component to be generated includes a target subcomponent, and the composite component to be generated corresponds to a composite component creation function.

[0065] Components encapsulate code snippets, which can be used to implement specific functions or render specific display effects. Atomic components are the most basic components of a page. They are indivisible and serve as the basis for other components. To meet the reuse requirements of business scenarios / application scenarios, a series of atomic components can be combined and encapsulated to form a composite component. Generally speaking, a composite component may include multiple subcomponents, and subcomponents may be nested in different container-type components. For example, a composite component includes subcomponent 1 and subcomponent 2, and subcomponent 2 is another composite component that includes subcomponent 3 and subcomponent 4.

[0066] In the disclosed embodiments, a composite component to be generated is a component currently under development / build, which already contains at least one subcomponent, at least one of which includes a target subcomponent. Based on the above description, a subcomponent in a composite component to be generated may be an atomic component or another already generated composite component.

[0067] It is understandable that the properties exposed by each composite component are related to the business scenario, and the exposed properties determine the capabilities provided by the composite component. When building an application page, users can further edit the exposed properties of the composite component in the application page to further customize the composite component. This allows the properties of the composite component to be edited both during development and during use, making it suitable for more business scenarios. For example, if the property exposed by the composite component is the title bar name, users can edit the title bar name when using the composite component.

[0068] In practice, composite components are rendered using a composite component creation function and its input parameters. A composite component creation function can be thought of as a piece of code used to render a composite component. Input parameters are configuration items used to control the behavior of the component instance on the page, such as the color of a button group component. These parameters are the externally exposed properties of the component, also known as custom properties.

[0069] In the process of developing composite components, there is a composite component creation function corresponding to the composite component to be generated. The properties that need to be exposed for the composite component to be generated can be set on the front end (for example, the first page of the front end). The back end can then add the exposed properties to the input parameters of the composite component creation function corresponding to the composite component to be generated.

[0070] S202: In response to the property adding operation of the target subcomponent in the composite component to be generated, each property of the target subcomponent is added to the input parameters of the composite component creation function.

[0071] The disclosed embodiments provide a sub-component-based input parameter setting method. Specifically, a user can perform an attribute addition operation on the target sub-component included in the composite component to be generated. In response to the attribute addition operation, each attribute of the target sub-component is added to the input parameters of the composite component creation function at one time. In this way, it is possible to implement sub-component-based input parameter setting, exposing the target sub-component as a whole, that is, exposing each attribute of the target sub-component to the outside world.

[0072] As an optional example, when the properties of the target subcomponent are complex and cannot be described using a single data type, the backend can describe the properties of the target subcomponent based on a structure in response to the property addition operation. A structure is a complex data type that can describe multiple properties of the target subcomponent. For example, the width, color, name, and other properties of the target subcomponent can be described in the structure at the same time.

[0073] For example, a user can perform a property addition operation on a target subcomponent on the first page. Referring to FIG. 3a , FIG. 3a is a schematic diagram illustrating the development of a composite component according to an embodiment of the present disclosure. FIG. 3a illustrates a component editor, wherein the page displayed in the component editor is the first page 110. The component editor is intended for component developers and can be used to develop composite components.

[0074] The custom component in Figure 3a refers to the composite component, and the composite component to be generated shown in Figure 3a is an advanced table component. As shown in Figure 3a, the first page 110 includes a component panel 111, a composite component development area 112, and a composite component property configuration area 113. Various components are displayed in the component panel 111, including atomic components, container components, and custom components. Among them, atomic components are, for example, text components, title bar components, filter components, image components, button group components, and drop-down selection components. Container components are, for example, block components and column components. Custom components are, for example, advanced tables, headers, footers, etc. The composite component being built (i.e., the composite component to be generated) is displayed in the composite component development area 112. The development area 112 shown in Figure 3a displays the internal sub-component composition of the composite component to be generated: the advanced table 1121. It can be seen that it includes a button group component 1121-1, a search component 1121-2, a filter component 1121-3 and a sorting component 1121-4, as well as the table container below (displaying the project name, project type, project status, target, operation, etc.). The configuration area 113 of the composite component properties is used to configure the properties, styles and events of the composite component. During the property configuration process, the properties (including externally exposed properties) of the table container, button group component, search component, filter component, sorting component, etc. in the composite component can be configured in the configuration area 113. For example, when the composite component is an advanced table, the target subcomponent can be the button group component, search component, filter component, sorting component, etc. inside the advanced table.

[0075] As an optional example, the composite component to be generated corresponds to a reference component property control. For example, as shown in FIG3a , an "Add Property" control 113-1 is displayed in the composite component property configuration area 113 on the first page. The "Add Property" control is used to add properties to the composite component. This control can be used to set the properties exposed by the composite component to be generated. The user can trigger the "Add Property" control, and in response to this triggering operation, page 113-2 is displayed. Page 113-2 displays an "Add Custom Property" control and a "Reference Component Property" control.

[0076] Among them, the "Add Custom Attributes" control is used to implement the input parameter setting method based on the data type. The input parameter setting method based on the data type is relatively simple. The backend sets the input parameters (i.e., custom attributes) through the definition of the data type, such as setting text type input parameters and numeric type input parameters (these input parameters can be the attributes of a sub-component). Moreover, only one custom attribute can be set each time. The "Reference Component Attributes" control is used to implement the input parameter setting method based on sub-components. It can be seen that when the composite component to be generated is the advanced table 1121 shown in Figure 3a, the "Reference Component Attributes" control can be understood as the reference component attribute control corresponding to the advanced table, and the function it implements is specifically to expose the sub-components of the advanced table as input parameters.

[0077] Based on this, in one possible implementation, the embodiment of the present disclosure provides a specific implementation method of adding various attributes of the target subcomponent to the input parameters of the composite component creation function in response to the attribute addition operation of the target subcomponent in the composite component to be generated in S202, including:

[0078] A1: In response to a triggering operation of a reference component property control corresponding to the composite component to be generated, a reference component property page corresponding to the composite component to be generated is displayed.

[0079] The user can trigger the reference component property control corresponding to the composite component to be generated. In response to the triggering operation, the reference component property page corresponding to the composite component to be generated is displayed. The triggering operation can be a click operation, a hover operation, an air gesture operation, etc., which are not limited here.

[0080] A2: In response to a selection operation on a label of a target subcomponent in a property page of a referenced component, various properties of the target subcomponent are added to input parameters of the composite component creation function.

[0081] The referenced component properties page displays the labels of each subcomponent within the composite component to be generated, including the label of the target subcomponent. As an alternative, the label of the target subcomponent can be its name or identification number, without limitation, as long as it uniquely identifies the target subcomponent.

[0082] The user can select the label of the target subcomponent in the reference component property page. In response to the selection operation, the backend will add various properties of the target subcomponent to the input parameters of the composite component creation function.

[0083] Based on the contents of A1-A2, it can be seen that the embodiment of the present disclosure provides a specific implementation method of the property adding operation, that is, the property adding operation can be a triggering operation of the reference component property control corresponding to the composite component to be generated combined with a selection operation of the label of the target subcomponent in the reference component property page.

[0084] Refer to Figure 3b, which is a development diagram of another composite component provided by an embodiment of the present disclosure. Figure 3b shows the reference component property page 210 corresponding to the composite component to be generated, which is displayed after the "reference component property" control is triggered. As shown in Figure 3b, the reference component property page displays the "category" operable item. "Property" and "Component" can be selected under the "Category" operable item. When "Component" is selected, the reference component property page also displays operable items such as "Select Component" and "Display Name". There is a corresponding drop-down menu under the "Select Component" operable item. As an optional example, the labels of each sub-component inside the composite component to be generated (not shown in the figure) are displayed in the drop-down menu of the "Select Component" operable item. In this way, the label of the target sub-component can be selected in the drop-down menu. In addition, after selecting the label of the target sub-component, its display name can also be edited through the "Display Name" operable item.

[0085] Based on the above, in the first page shown in Figures 3a and 3b, the operation path based on the subcomponent input parameter setting method is to trigger the "Add Custom Property" control, then trigger the "Reference Component Property" control, and finally select the target subcomponent label from the drop-down menu under the "Select Component" actionable item on the reference component property page. This can achieve the goal of exposing the entire target subcomponent as input, that is, all the properties of the target subcomponent are used as input parameters of the composite component creation function.

[0086] In addition, the referenced component properties page also displays a prompt message: "Note: After using the component as input, the relevant configuration of this component can be fully customized on the page." In other words, when building a page, if you use the Generate non-composite component, all properties of the target sub-components included in the composite component can be edited.

[0087] It can be understood that when the target subcomponent of the composite component to be generated is another composite component that has already been generated, the various properties of the target subcomponent are the various properties of each atomic component that constitutes the composite component.

[0088] S203: Generate a target composite component based on the composite component creation function and input parameters; wherein each property of the target sub-component included in the target composite component is editable.

[0089] After the input parameters of the composite component creation function are set, the backend generates the target composite component based on the composite component creation function and the input parameters. Specifically, the composite component is generated based on the composite component creation function and the input parameters and then rendered to obtain the target composite component. It should be understood that the properties of the target subcomponents included in the generated target composite component are editable. In other words, the properties of the target subcomponents included in the target composite component are all externally exposed properties.

[0090] After generating the target composite component, it's automatically added to the Composite Components area of ​​the Components panel, as shown in the "Custom Components" area in Figures 3a and 3b. This allows users to quickly drag the target composite component from the Composite Components area into an application page, enabling the creation of the application page and reuse of the target composite component within that application page. The process of using a component within an application page is also known as the component consumption process.

[0091] As can be seen from the foregoing, the disclosed embodiments provide a subcomponent-based parameter setting method, enabling the use of entire subcomponents within a composite component as input parameters. This significantly enhances the component's ability to meet personalized scenario requirements without sacrificing the component's high degree of encapsulation and reuse. Thus, when consuming a target composite component, users can select a target subcomponent within the composite component for personalized adjustments, enabling them to edit the individual properties of the target subcomponent.

[0092] Based on the relevant contents of S201-S203 above, it can be known that an embodiment of the present disclosure provides a method for processing a composite component to determine a composite component to be generated. The composite component to be generated already includes a target subcomponent, and the composite component to be generated corresponds to a composite component creation function. The user can perform an attribute addition operation of the target subcomponent of the composite component to be generated, and in response to the attribute addition operation, all attributes of the target subcomponent are added to the input parameters of the composite component creation function corresponding to the composite component to be generated. Then, based on the composite component creation function and the input parameters of the composite component creation function, the target composite component is generated. Based on this, all attributes of the target subcomponent included in the target composite component are exposed, and when the target composite component is used, all attributes of the target subcomponent inside it can be edited. In this way, the present disclosure directly uses the various attributes of the target subcomponent as input parameters through the attribute addition operation, and exposes all its attributes at one time based on the entire target subcomponent, thereby realizing a one-time adjustment of all attributes of the target subcomponent in the composite component to be generated. When using a target composite component, you can personalize and adjust the properties of the target subcomponents in the target composite component, so as to meet the editing requirements of the properties of the target subcomponents in the target composite component in a specific business scenario.

[0093] It is understandable that the number of attributes of the sub-components in the composite component to be generated may be large. For example, the attributes of the text component include various attributes such as text font, text size, text color, text color, text border, etc. According to the business scenario requirements, only some of the attributes may need to be exposed, for example, the attributes that need to be exposed to the outside are only text fonts. Based on this, in addition to the "add custom attributes" shown in Figure 3a, the embodiment of the present disclosure also provides the following another way to achieve the purpose of adjusting some attributes of the sub-components to custom attributes.

[0094] As an optional example, each attribute of the target subcomponent includes a target attribute. The target attribute can be one or more attributes, which is not limited here. For example, if the target subcomponent is a text component, the target attribute is the text font attribute of the text component. Based on this, the embodiment of the present disclosure also provides the following steps to realize the external exposure of the target attribute. Specifically including:

[0095] B1: In response to a triggering operation of a reference component property control corresponding to the composite component to be generated, a reference component property page corresponding to the composite component to be generated is displayed.

[0096] Among them, step B1 is the same as the above-mentioned step A1. Its technical implementation can refer to step A1 and will not be repeated here.

[0097] B2: In response to the selection operation of the target subcomponent label in the reference component property page and the selection operation of the target property in the reference component property page, the target property of the target subcomponent is added to the input parameters of the composite component creation function.

[0098] As shown in step A2, the user can select the label of the target subcomponent in the reference component property page. In response to this selection, the subcomponent to be operated on can be determined as the target subcomponent. Furthermore, after determining that the subcomponent to be operated on is the target subcomponent, the user can also select the target attribute of the target subcomponent in the reference component property page. In response to this selection, the target attribute of the target subcomponent is determined to be added to the input parameters of the composite component creation function.

[0099] As shown in Figure 3b, after the user selects "Component" under the "Category" operable item, he can select the label of the target subcomponent under the "Select Component" operable item. In this way, the subcomponent to be operated subsequently is determined to be the target subcomponent. Furthermore, the user can further select "Property" under the "Category" operable item, so that the "Select Property" operable item will be displayed in the referenced component property page (not shown in the figure). As an optional example, the "Select Property" operable item has a corresponding drop-down menu, and the drop-down menu will display the various properties of the target subcomponent. Based on this, the user can further select the target property in the drop-down menu of the "Select Property" operable item. In response to the selection operation, it is determined that the target property of the target subcomponent is added to the input parameters of the composite component creation function.

[0100] B3: Generate a target composite component based on the composite component creation function and input parameters; wherein the target properties of the target subcomponents included in the target composite component are editable.

[0101] After executing B1-B2, if the input parameters of the composite component creation function corresponding to the composite component to be generated have been set, the target composite component can be generated based on the composite component creation function and the input parameters. It should be understood that the target properties of the target sub-components included in the generated target composite component are editable. That is, the target properties of the target sub-components are externally exposed properties. In this way, based on B1-B3, the component developer is provided with the ability to freely open or restrict the properties of the target sub-component, which can improve the overall stability and usability of the composite component.

[0102] After creating the target composite component, the development process of the target composite component is completed. Therefore, when developing an application page, the target composite component can be used to build the application page. Based on this, in one possible implementation, the embodiment of the present disclosure further includes the following steps:

[0103] C1: In response to an add operation on a target composite component, display the target composite component.

[0104] For example, the target composite component is displayed on a second page. The second page is a page in a page editor, which is used to implement the development of an application page. The user can add the target composite component to the second page, making the target composite component a component of the application page. It should be understood that the first page (the composite component development page) and the second page can be the same page or different pages, which is not limited here.

[0105] As an optional example, the operation of adding the target composite component is a drag-and-drop operation. The user can directly drag the target composite component into the second page. In response to the drag-and-drop operation, the target composite component is added and displayed on the second page. It will be appreciated that the display position of the target composite component on the second page is determined based on page development requirements.

[0106] C2: In response to a triggering operation on a target subcomponent included in a target composite component, a property editing area corresponding to the target subcomponent is displayed; the property editing area corresponding to the target subcomponent displays various editable properties of the target subcomponent.

[0107] After the target subcomponent is exposed as a whole, users can edit the properties of the target subcomponents included in the target composite component. Specifically, when consuming the target composite component, the page supports directly selecting the target subcomponent within the target composite component, allowing users to customize the properties of the target subcomponent after selecting the target subcomponent.

[0108] For example, when the mouse passes over the target subcomponent or the mouse hovers over the target subcomponent, the bounding box of the target subcomponent is displayed. The bounding box can be displayed in a specific color, such as blue, which indicates that the target subcomponent is selected. Various properties of the target subcomponent are individually editable.

[0109] Furthermore, the user can trigger a target subcomponent within the displayed target composite component. In response to this triggering action, a property editing area corresponding to the target subcomponent is displayed. The triggering action can be a click, hover, or air gesture, and is not limited here. The property editing area corresponding to the target subcomponent displays the editable properties of the target subcomponent and is used to edit the properties of the target subcomponent.

[0110] For example, the property editing area corresponding to the target subcomponent is displayed in the second page. Referring to Figure 4a, Figure 4a is a schematic diagram of the use of a composite component provided by an embodiment of the present disclosure. As shown in Figure 4a, when the application page is developed, a second page 310 is displayed in the page editor. The second page displays an application page 311 under development, which is exemplarily a development page for project management. The target composite component displayed in the second page 310 in Figure 4a is an advanced table 312, and the target subcomponent is a button group component (the "New" component 3121 in Figure 4a). In addition, the application page 311 also includes various contents built according to the business scenarios of project management, such as "horizontal special categories", "co-creation categories", and "experience optimization categories".

[0111] For example, when the mouse hovers over "New" button group component 3121, its bounding box 3121-1 is displayed. The user can trigger "New" button group component 3121, and the corresponding property editing area for "New" button group component 3121 is displayed on the right side of page editor 310. As shown in Figure 3a, the button type, icon and name, button width, etc. are all externally exposed properties of "New" button group component 3121 and can be customized by the user.

[0112] In addition, the embodiment of the present disclosure also provides a copy function, a copy creation function, and a delete function for the target sub-component. As shown in Figure 4a, when the "New" button group component 3121 displays its bounding box 3121-1, it will also display the operable controls 3121-2 corresponding to the "New" button group component 3121, such as the "Copy" control, the "Create a Copy" control, and the "Delete" control. Among them, the "Copy" control is used to implement the copying of the "New" button group component 3121 (if a copy of the "New" button group component 3121 needs to be created, a paste operation needs to be performed), the "Create a Copy" control is used to directly create a copy of the "New" button group component 3121, and the "Delete" control is used to implement the deletion of the "New" button group component 3121. In this way, the editing of the target sub-component is made more flexible, further satisfying the user's personalized editing needs for the target sub-component.

[0113] Refer to Figure 4b, which is a schematic diagram of the use of another composite component provided in an embodiment of the present disclosure. In Figure 4b, the target composite component is an advanced table, and the target subcomponent is a search component (such as the "search" component 3122 in Figure 4b). For example, when the mouse slides over the "search" component 3122, its bounding box 3122-1 is displayed. The user can trigger the "search" component 3122, and the property editing area corresponding to the "search" component 3122 is displayed on the right side of the page editor 310. As shown in Figure 3b, placeholders, IDs, etc. are all properties of the "search" component 3122. These are all externally exposed properties and can be customized and edited by the user. Similarly, the "search" component 3122 also has a corresponding operable control 3122-2, and the functions implemented are similar to those of the operable control 3121-2 corresponding to the "new" button group component 3121 described in the above embodiment, which will not be repeated here.

[0114] It is understandable that FIG. 4 a and FIG. 4 b are merely provided as examples and do not constitute a limitation.

[0115] C3: In response to an editing operation on the properties of the target subcomponent in the property editing area corresponding to the target subcomponent, redisplay the edited target subcomponent.

[0116] The properties of the target subcomponent in the property editing area are custom properties and are all editable. The editing operation can be determined based on the specific properties. After editing the properties of the target subcomponent, the edited target subcomponent is displayed, which is equivalent to re-rendering and displaying the edited target composite component. For example, when the target subcomponent is the button group component 3122 shown in Figure 4a, its button width can be edited. As a result, the "New" button group component 3121 will be re-rendered on the page based on the edited button width.

[0117] Based on the content of C1-C3, we can see that when consuming the target composite component, the user can only perceive the input of the target composite component (that is, the input parameters of the composite component creation function corresponding to the target composite component). Therefore, after exposing the target subcomponent of the target composite component as an input, the target subcomponent can be selected when consuming the target composite component, and atomic configuration of the target subcomponent can be achieved.

[0118] As an optional example, the target subcomponent included in the composite component to be generated may be a slot component. Among them, the slot component is a container-type component that can be filled with other components inside. Before the composite component to be generated is generated, the slot component is selected as an input parameter for exposure. For example, select the label of the slot component in the reference component property page 210 shown in Figure 3b. The slot component is actually a placeholder (such as a slot placeholder), and other components can be added to the placeholder. In actual applications, in response to the selection operation of the slot component label, the backend will add the placeholder to the input parameter, so as to achieve the purpose of the slot component as an input parameter.

[0119] It should be understood that when developing a composite component to be generated, if the slot component inside the composite component to be generated is exposed as an input, then after the target composite component is generated, the slot area corresponding to the slot component will be displayed in the added target composite component, and the user can freely add other components in the slot area.

[0120] Based on this, in a possible implementation, the method for processing a composite component provided by the embodiment of the present disclosure may further include the following steps:

[0121] In response to an add operation on a component in the slot area, the component is added to the slot area.

[0122] Refer to Figure 4c, which is a schematic diagram of the use of another composite component provided by an embodiment of the present disclosure. As shown in Figure 4c, the slot area 3123 is usually indicated by a bounding box inside which other components can be dragged. An internal component, namely the "New" button group component 3121, is already displayed in the slot area 3123 of Figure 4c. It can be seen that there is a blank space in the slot area 3123 for adding other components. Therefore, other components can also be added to the slot area, and the components are added to the slot area in response to the add operation. In this way, when different pages consume the target composite component, components that meet the page development requirements can be added to the slot area, making the development of different pages more flexible and able to meet the personalized needs of different pages.

[0123] It is understandable that each property of the component added to the slot area can also be edited.

[0124] Based on the above, it can be seen that the embodiment of the present disclosure provides a sub-component-based parameter setting method to meet the user's editing needs for the entire sub-component. Therefore, when the exposed sub-components still cannot meet the business scenario requirements, the embodiment of the present disclosure also provides the following methods D1-D3. D1-D3 is a method for consuming composite components, specifically including:

[0125] D1: In response to the unbinding operation of the added target composite component, the subcomponents of the target composite component after being unbound are displayed; each property of the subcomponents of the target composite component after being unbound is editable.

[0126] The user can unbind the added target composite component. This unbinding operation breaks the target composite component down into its finest-grained atomic components. In response to this unbinding operation, the unbound subcomponents of the target composite component are displayed, and the unbound subcomponents are atomic components.

[0127] The composite component creation function corresponding to the target composite component describes the internal structure and encapsulation of the target composite component. In actual applications, in response to the unbinding operation, the backend will destroy the internal structure and encapsulation description of the target composite component in the composite component creation function and directly render the atomic components within the target composite component.

[0128] It is understandable that even if the target composite component to be unbound includes another composite component, the finest-grained atomic component will be restored after the unbinding operation is performed. For example, the target composite component E includes composite component F, atomic component A, and atomic component B, and composite component F includes atomic component C and atomic component D. After the unbinding operation is performed on the target composite component E, the target composite component E will be broken down into atomic component A, atomic component B, atomic component C, and atomic component D. Each atomic component is independent of each other and is not combined or encapsulated. Based on this, the sub-components of the target composite component after unbinding are atomic components, and each property of the atomic component is editable.

[0129] As an optional example, the target composite component has an unbinding control. Based on this, the embodiment of the present disclosure uses a D1 in response to the unbinding operation of the added target composite component to show the specific implementation of the subcomponent after the target composite component is unbound, including:

[0130] In response to the triggering operation of the unbinding control corresponding to the target composite component, the subcomponents after the target composite component is unbound are displayed.

[0131] Refer to Figure 5a, which is a schematic diagram of unbinding a composite component provided by an embodiment of the present disclosure. Figure 5a shows the second page in an application scenario. As shown in Figure 5a, the target composite component 410 is a custom table, which is composed of a high-level table and various indicator card components (such as indicator card 1 "unresolved issues", indicator card 2 "problems in the process", indicator card 3 "resolved issues", indicator card 4 "timeout unresolved issues"). When the user slides over the target composite component 410 or hovers the mouse over the target composite component 410, the target composite component 410 is displayed as selected. At this time, the corresponding operable controls will be displayed above the target composite component 410, and the operable controls include an "unbinding" control 410-1. By triggering the "unbinding" control 410-1, the various sub-components of the target composite component after unbinding will be displayed.

[0132] After unbinding the target composite component, the target composite component will be updated to display its internal atomic components, and the original internal structure of the target composite component will be destroyed. If there is another identical target composite component on the same page, unbinding one of the target composite components will not synchronize the unbinding of the other identical target composite components on the same page. In other words, the unbinding of the target composite component is equivalent to creating a brand new copy of the target composite component, except that the atomic components in the copy are not encapsulated. At this time, modifications to the copy will not affect other identical target composite components on the same page, and modifications to other identical target composite components on the same page will not affect the copy.

[0133] Based on this, before unbinding is achieved, the user will be prompted whether to confirm the unbinding. See Figure 5b, which is a schematic diagram of an unbinding pop-up window provided in an embodiment of the present disclosure. As shown in Figure 5b, the pop-up window displays a prompt message "After unbinding, changes to the component will not be synchronized to the current component, the configured content will not be affected, and all atomic components will be exposed and support separate configuration" to prompt the user whether to confirm the unbinding of the composite component. Among them, "current component" refers to the target composite component itself.

[0134] Refer to Figure 5c, which is a schematic diagram of unbinding another composite component provided by an embodiment of the present disclosure. Figure 5c shows the second page before unbinding. As shown in Figure 5c, before unbinding the target composite component 410, its component outline tree only includes the component node of the target composite component "Custom Table", and does not have the component nodes of the sub-components within the target composite component 410. Refer to Figure 5d, which is a schematic diagram of an unbinding composite component provided by an embodiment of the present disclosure. Figure 5d shows the second page after unbinding. As shown in Figure 5d, after unbinding the target composite component 410, its component outline tree displays the component nodes of each sub-component of the target composite component 410. It can be understood that when developing the target composite component 410, atomic components such as the title bar component, button group component, search component, and sorting component are all placed in the table container, and the table container and atomic components such as indicator card 1, indicator card 2, indicator card 3, and indicator card 4 are all placed in the block component. The block component is a container-type component that can accommodate other components. After unbinding the target composite component 410, the component outline tree displays the various atomic components, including indicator card 1, indicator card 2, indicator card 3, indicator card 4, title bar component, button group component, search component, and sorting component. The title bar component, button group component, search component, and sorting component remain within the table component, and the atomic components remain within the block component, but are not encapsulated. Therefore, each atomic component's properties are editable.

[0135] Additionally, as shown in Figure 5d, the root node is displayed by default in the component outline tree after unbinding and in the component property editing area on the right side of the page. Because the block component's position in the component outline tree is the root / outermost layer of the entire target composite component, the block component's component node is displayed by default.

[0136] Based on the above content, it can be seen that after the target composite component is unbound, its internal sub-components are exposed to the outside world. Specifically, the sub-components after the target composite component is unbound can be independently selected and configured separately, and the component outline tree displayed on the page displays the component nodes of the sub-components after the target composite component is unbound.

[0137] D2: In response to the triggering operation of the subcomponent after the target composite component is unbound, the property editing area corresponding to the subcomponent is displayed; the property editing area corresponding to the subcomponent displays various editable properties of the subcomponent.

[0138] After the target composite component is unbound, its subcomponents can be individually selected and configured by the user. Therefore, the user can trigger any subcomponent after the target composite component is unbound. In response to this triggering operation, the property editing area corresponding to the triggered subcomponent is displayed. As shown in Figure 5d, the property editing area on the right side of the page specifically corresponds to the triggered subcomponent, displaying the editable properties of the subcomponent for implementing the properties of the triggered subcomponent.

[0139] For example, if the triggered subcomponent is a "New" button group component, the property editing area corresponding to the button group component will be displayed on the right (see Figure 4a).

[0140] D3: In response to an editing operation on the properties of the sub-component in the property editing area corresponding to the sub-component, the edited sub-component is redisplayed.

[0141] Editing operations for subcomponent properties are determined by the subcomponent and are not limited here. For example, if the triggered subcomponent is a "New" button group component, and the subcomponent's properties include button type, icon and name, and button width, the edit operations can include editing the button type, icon and name, and button width.

[0142] In response to an edit operation on a subcomponent's properties in its corresponding property editing area, the edited subcomponent is re-displayed on the page. For example, if the triggered subcomponent is a "New" button group component and the edit operation is to re-edit the button width, the backend will re-render and display the "New" button group component based on this, and the width of the re-displayed "New" button group component will be the edited button width.

[0143] Based on D1-D3, the present disclosure supports flexible unbinding of target composite components in a page. After unbinding, each property of each subcomponent can be edited. This can be applied to business scenarios with high personalization requirements, and can improve the flexibility of component editing without destroying its functional performance.

[0144] Referring to Figure 5a again, the corresponding operable controls displayed above the target composite component 410 on the second page also include a "Configuration" control 410-2. The user can trigger the "Configuration" control 410-2, and in response to the trigger operation, the target composite component 410 and the configuration area corresponding to the target composite component 410 are displayed on the first page (the configuration area can refer to the configuration area 113 shown in Figure 3a). Furthermore, the user can re-edit the properties of the target composite component in the configuration area corresponding to the target composite component 410. For example, a sub-component inside the target composite component is exposed as an input parameter again. In this way, when the user consumes the target composite component, if it is found that the created target composite component cannot meet the scenario requirements, it can also jump to the first page of the component editor through the "Configuration" control 410-2 on the second page to perform secondary development of the target composite component to meet the new scenario requirements.

[0145] The following will further describe the method for unbinding the target composite component provided by the embodiment of the present disclosure in the form of simple block diagrams shown in Figures 6a to 6c.

[0146] See Figure 6a, which is a schematic diagram of the structure of a composite component E provided by an embodiment of the present disclosure. Components A, B, C, and D have already constructed the target composite component E. As shown in Figure 6a, component C includes component D. Components A, B, and C, which includes component D, together constitute the target composite component E.

[0147] Refer to Figure 6b, which is a page schematic diagram provided by an embodiment of the present disclosure. When developing an application page, two target composite components E are dragged into the page as components of the page. It can be seen that the two target composite components E correspond to the same composite component creation function, that is, the composite component creation function created by the target composite component E during development. Since the target composite component E is a newly created component, when the internal structure of one target composite component E in the page changes, since the same composite component creation function is called, the other target composite component E in the page also references the composite component creation function, and the internal structure of the other target composite component E will also change accordingly. For example, if the positions of components A and B in one target composite component E on the page are adjusted, the positions of components A and B in another target composite component E on the page will also change accordingly. Before the target composite component E is unbound, the user can only select the target composite component E and edit the properties exposed by the target composite component E.

[0148] See Figure 6c, which is another page diagram provided by an embodiment of the present disclosure. As shown in Figure 6C, after the target composite component E is unbound, the internal structure of the target composite component E is expanded to the page, and the user can then select components A, B, C, and D and directly edit the properties of the internal components A, B, C, and D. It is understandable that after the target composite component E is unbound, adjusting the positions of components A and B in the target composite component E on the page will not change accordingly.

[0149] As an optional example, the subcomponents after unbinding the target composite component can also be reassembled. Based on this, in a possible implementation, the composite component processing method provided by the embodiment of the present disclosure can also include the following steps:

[0150] E1: In response to a combination operation on at least two subcomponents after unbundling the target composite component, a composite component consisting of the at least two subcomponents is obtained.

[0151] After the target composite component is unbound, its subcomponents can be reassembled. In actual applications, the at least two subcomponents that need to be reassembled can be determined based on the business scenario, and this is not limited here.

[0152] After the user performs a combine operation on at least two subcomponents in the target composite component, a composite component composed of the at least two subcomponents is created in response to the operation and rendered on the page. In specific implementations, in response to the combine operation, the backend creates a corresponding composite component creation function and renders the composite component composed of the at least two subcomponents on the page based on the composite component creation function and its input parameters. The input parameters of the composite component creation function corresponding to the composite component composed of the at least two subcomponents can be default parameters.

[0153] It is understood that after obtaining the composite component (i.e., a composite component consisting of at least two subcomponents), the composite component can be selected and edited by the user, but the subcomponents within it cannot be selected and edited. In addition, after obtaining the composite component, the component outline tree will be updated.

[0154] As an optional example, an embodiment of the present disclosure provides a specific implementation of obtaining a composite component consisting of at least two subcomponents in response to a combination operation of at least two subcomponents after unbinding a target composite component in E1, including:

[0155] In response to a selection operation on at least two unbound subcomponents of the target composite component and a triggering operation on a combination control corresponding to at least two subcomponents in the target composite component, a composite component consisting of at least two subcomponents is obtained.

[0156] The user can simultaneously select at least two subcomponents in the target composite component and then trigger the corresponding combination controls. In response to these operations, a composite component consisting of at least two subcomponents is obtained. In other words, the combination operation on at least two subcomponents in the target composite component includes the selection operation on the at least two subcomponents in the target composite component and the triggering operation on the combination controls corresponding to the at least two subcomponents in the target composite component.

[0157] It is understood that the embodiments of the present disclosure do not limit the display method and display location of the combination control on the page. For example, as shown in Figures 4a and 4b, after selecting at least two sub-components, the corresponding operable controls can be displayed on the second page, and the operable controls include the combination control.

[0158] See Figure 6d, which is another page diagram provided by an embodiment of the present disclosure. After unbinding the target composite component, components A, B, C, and D are obtained. The recombined components are determined to be components A and B. Components A and B are selected on the page, and the corresponding combination controls are triggered, resulting in the recombined composite component F. The internal implementation / internal composition structure of composite component F is then components A and B.

[0159] E2: A composite component consisting of at least two subcomponents is automatically added to the composite component list; the generated composite component is displayed in the composite component list.

[0160] When a composite component consisting of at least two subcomponents is obtained, the composite component can be automatically added to the composite component list. As shown in Figures 3a and 3b, the composite component list is displayed in the "Custom Component" area, which includes various generated composite components.

[0161] As an optional example, an embodiment of the present disclosure provides a method of obtaining a composite component composed of at least two subcomponents in response to a combination operation of at least two subcomponents after unbinding a target composite component in E1, including:

[0162] E11: In response to a combination operation on at least two subcomponents after unbinding the target composite component, a composite component to be configured consisting of at least two subcomponents is obtained; the composite component to be configured corresponds to a configuration control.

[0163] It can be understood that, in this example, the "combined operation on at least two sub-components in the target composite component" may be the "selection operation on at least two sub-components in the target composite component and the triggering operation on the combined controls corresponding to at least two sub-components in the target composite component" described in the above embodiment.

[0164] In response to the combination operation of at least two subcomponents after unbinding the target composite component, a composite component to be configured consisting of at least two subcomponents is first obtained, and then the composite component to be configured needs to be configured.

[0165] As an optional example, the composite component to be configured has a configuration control. After obtaining the composite component to be configured, selecting the composite component to be configured will display the operable controls corresponding to the composite component to be configured, and the configuration controls corresponding to the composite component to be configured will be displayed in the operable controls (see the "Configuration" control 410-2 in Figure 5a).

[0166] E12: In response to a triggering operation of a configuration control corresponding to the composite component to be configured, the composite component to be configured and a configuration area corresponding to the composite component to be configured are displayed.

[0167] The user can trigger the configuration control corresponding to the composite component to be configured. In response to this triggering operation, the composite component to be configured and the configuration area corresponding to the composite component to be configured are displayed. For example, the composite component to be configured and the configuration area corresponding to the composite component to be configured are displayed on the first page (the configuration area can refer to the configuration area 113 shown in Figure 3a). Then, the user can configure the composite component to be configured in the configuration area corresponding to the composite component to be configured. For example, the user can configure the properties of the composite component to be configured.

[0168] E13: In response to a configuration operation on the composite component to be configured in the configuration area corresponding to the composite component to be configured, a composite component consisting of at least two sub-components is obtained.

[0169] After the configuration of the composite component to be configured is completed in the configuration area corresponding to the composite component to be configured, a composite component consisting of at least two sub-components is obtained.

[0170] Based on E1-E2 and E11-E13, it can be seen that the embodiment of the present disclosure provides a method for generating a composite component. After unbinding the original target composite component, some sub-components obtained after unbinding the original target composite component can be recombined, which makes the operability of the component more flexible and can further meet the needs of business scenarios.

[0171] Those skilled in the art will understand that in the above-mentioned method of the specific implementation method, the writing order of each step does not mean a strict execution order and does not constitute any limitation on the implementation process. The specific execution order of each step should be determined by its function and possible internal logic.

[0172] Based on the implementations provided in the above aspects, the present disclosure can be further combined to provide more implementations.

[0173] Based on the composite component processing method provided in the above-mentioned method embodiment, the present disclosure also provides a composite component processing device. The composite component processing device is described below with reference to the accompanying drawings. Since the principle of the problem solved by the device in the present disclosure embodiment is similar to that of the composite component processing method in the above-mentioned embodiment, the implementation of the device can be referred to as the implementation of the method, and the repeated parts will not be repeated here.

[0174] Referring to FIG7 , which is a schematic diagram of a structure of a composite component processing device provided by an embodiment of the present disclosure, as shown in FIG7 , the composite component processing device includes:

[0175] A determining unit 701 is configured to determine a composite component to be generated; the composite component to be generated includes a target subcomponent, and the composite component to be generated corresponds to a composite component creation function;

[0176] A first adding unit 702 is configured to add various properties of the target subcomponent to the input parameters of the composite component creation function in response to a property adding operation on the target subcomponent in the composite component to be generated;

[0177] The first generating unit 703 is configured to generate a target composite component based on the composite component creation function and the input parameters; wherein each property of the target subcomponent included in the target composite component is editable.

[0178] In a possible implementation, the composite component to be generated corresponds to a reference component property control; the first adding unit 702 includes:

[0179] A display subunit, configured to display a reference component property page corresponding to the composite component to be generated in response to a triggering operation on a reference component property control corresponding to the composite component to be generated;

[0180] The adding sub-unit is used to add various properties of the target sub-component to the input parameters of the composite component creation function in response to the selection operation of the label of the target sub-component in the reference component property page.

[0181] In a possible implementation, the composite component to be generated corresponds to a reference component property control, each property of the target subcomponent includes a target property, and the apparatus further includes:

[0182] A first display unit is configured to display a reference component property page corresponding to the composite component to be generated in response to a triggering operation on a reference component property control corresponding to the composite component to be generated;

[0183] a second adding unit, configured to add the target property of the target subcomponent to the input parameters of the composite component creation function in response to a selection operation on a label of the target subcomponent in the reference component property page and a selection operation on the target property in the reference component property page;

[0184] The second generating unit is configured to generate a target composite component based on the composite component creation function and the input parameters; wherein the target attributes of the target subcomponents included in the target composite component are editable.

[0185] In a possible implementation, the apparatus further includes:

[0186] A second display unit is configured to display the target composite component in response to an add operation on the target composite component;

[0187] A third display unit is configured to display a property editing area corresponding to the target subcomponent in response to a triggering operation on the target subcomponent included in the target composite component; the property editing area corresponding to the target subcomponent displays various editable properties of the target subcomponent;

[0188] The fourth display unit is configured to, in response to an editing operation on the properties of the target subcomponent in the property editing area corresponding to the target subcomponent, re-display the edited target subcomponent.

[0189] In a possible implementation, the target subcomponent is a slot component, and a slot area corresponding to the slot component is displayed in the target composite component; the apparatus further includes:

[0190] A third adding unit is configured to add the component to the slot area in response to an adding operation on the component in the slot area.

[0191] In a possible implementation, the apparatus further includes:

[0192] an unbinding unit, configured to display the unbound subcomponents of the target composite component in response to an unbinding operation on the added target composite component; each property of the unbound subcomponents of the target composite component is editable;

[0193] A fifth display unit is configured to display a property editing area corresponding to the subcomponent in response to a triggering operation on the subcomponent after the target composite component is unbound; the property editing area corresponding to the subcomponent displays various editable properties of the subcomponent;

[0194] The sixth display unit is configured to, in response to an editing operation on the properties of the subcomponent in the property editing area corresponding to the subcomponent, re-display the edited subcomponent.

[0195] In a possible implementation, the target composite component corresponds to an unbinding control, and the unbinding unit is specifically configured to:

[0196] In response to a triggering operation on an unbinding control corresponding to the target composite component, each subcomponent of the target composite component after being unbound is displayed.

[0197] In a possible implementation, the apparatus further includes:

[0198] a combining unit, configured to obtain a composite component consisting of the at least two subcomponents in response to a combining operation on the at least two subcomponents after the target composite component is unbound;

[0199] The fourth adding unit is used to automatically add the composite component composed of the at least two sub-components to the composite component list; the composite component list displays the generated composite component.

[0200] In a possible implementation, the combination unit is specifically configured to:

[0201] In response to a selection operation on at least two unbound subcomponents of the target composite component and a triggering operation on combination controls corresponding to at least two subcomponents in the target composite component, a composite component consisting of the at least two subcomponents is obtained.

[0202] In a possible implementation, the combination unit includes:

[0203] a combining subunit, configured to obtain a to-be-configured composite component consisting of the at least two subcomponents in response to a combining operation on the at least two subcomponents after the target composite component is unbound; the to-be-configured composite component corresponds to a configuration control;

[0204] a triggering subunit, configured to display the composite component to be configured and a configuration area corresponding to the composite component to be configured in response to a triggering operation on a configuration control corresponding to the composite component to be configured;

[0205] The configuration subunit is configured to obtain a composite component consisting of the at least two subcomponents in response to a configuration operation on the composite component to be configured in a configuration area corresponding to the composite component to be configured.

[0206] It should be noted that the specific implementation of each unit in this embodiment can refer to the relevant description in the above-mentioned method embodiment. The division of units in the embodiment of the present disclosure is schematic and is only a logical function division. There may be other division methods in actual implementation. The functional units in the embodiment of the present disclosure can be integrated into a processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit. For example, in the above-mentioned embodiment, the processing unit and the sending unit can be the same unit or different units. The above-mentioned integrated units can be implemented in the form of hardware or in the form of software functional units.

[0207] Based on the method for processing a composite component provided in the above method embodiment, the present disclosure also provides an electronic device, including: one or more processors; a storage device on which one or more programs are stored, and when the one or more programs are executed by the one or more processors, the one or more processors implement the method for processing a composite component described in any of the above embodiments.

[0208] Reference is now made to FIG8 , which illustrates a schematic diagram of the structure of an electronic device 800 suitable for implementing an embodiment of the present disclosure. The terminal devices in the embodiments of the present disclosure may include, but are not limited to, mobile terminals such as mobile phones, laptop computers, digital broadcast receivers, PDAs (Personal Digital Assistants), PADs (portable Android devices), PMPs (Portable Media Players), vehicle-mounted terminals (e.g., vehicle-mounted navigation terminals), and fixed terminals such as digital televisions (TVs) and desktop computers. The electronic device illustrated in FIG8 is merely an example and should not limit the functionality and scope of use of the embodiments of the present disclosure.

[0209] As shown in Figure 8, the electronic device 800 may include a processing device (e.g., a central processing unit, a graphics processing unit, etc.) 801, which can perform various appropriate actions and processes according to a program stored in a read-only memory (ROM) 802 or a program loaded from a storage device 808 into a random access memory (RAM) 803. Various programs and data required for the operation of the electronic device 800 are also stored in the RAM 803. The processing device 801, the ROM 802, and the RAM 803 are connected to each other via a bus 804. An input / output (I / O) interface 805 is also connected to the bus 804.

[0210] Typically, the following devices may be connected to the I / O interface 805: an input device 806 including, for example, a touch screen, a touchpad, a keyboard, a mouse, a camera, a microphone, an accelerometer, a gyroscope, etc.; an output device 807 including, for example, a liquid crystal display (LCD), a speaker, a vibrator, etc.; a storage device 808 including, for example, a magnetic tape, a hard disk, etc.; and a communication device 809. The communication device 809 may allow the electronic device 800 to communicate with other devices wirelessly or by wire to exchange data. Although FIG8 shows the electronic device 800 with various devices, it should be understood that it is not required to implement or have all of the devices shown. More or fewer devices may be implemented or have alternatively.

[0211] In particular, according to an embodiment of the present disclosure, the process described above with reference to the flowchart can be implemented as a computer software program. For example, an embodiment of the present disclosure includes a computer program product, which includes a computer program carried on a non-transitory computer-readable medium, and the computer program includes a program code for executing the method shown in the flowchart. In such an embodiment, the computer program can be downloaded and installed from the network through the communication device 809, or installed from the storage device 808, or installed from the ROM 802. When the computer program is executed by the processing device 801, the above-mentioned functions defined in the method of the embodiment of the present disclosure are performed.

[0212] The electronic device provided in the embodiment of the present disclosure and the processing method of the composite component provided in the above embodiment belong to the same inventive concept. For technical details not fully described in this embodiment, please refer to the above embodiment, and this embodiment has the same beneficial effects as the above embodiment.

[0213] Based on a method for processing a composite component provided in the above method embodiment, an embodiment of the present disclosure provides a computer-readable medium on which a computer program is stored, wherein when the program is executed by a processor, the method for processing a composite component as described in any of the above embodiments is implemented.

[0214] It should be noted that the computer-readable medium mentioned above in the present disclosure may be a computer-readable signal medium or a computer-readable storage medium, or any combination of the two. A computer-readable storage medium may be, for example, but not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, device, or component, or any combination of the above. More specific examples of computer-readable storage media may include, but are not limited to: an electrical connection with one or more wires, a portable computer disk, a hard disk, a random access memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the above. In the present disclosure, a computer-readable storage medium may be any tangible medium that contains or stores a program that can be used by or in conjunction with an instruction execution system, device, or component. In the present disclosure, a computer-readable signal medium may include a data signal propagated in baseband or as part of a carrier wave, which carries computer-readable program code. Such a propagated data signal may take a variety of forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination of the above. A computer-readable signal medium may also be any computer-readable medium other than a computer-readable storage medium that can transmit, propagate, or transport a program for use by or in conjunction with an instruction execution system, apparatus, or device. The program code contained on the computer-readable medium may be transmitted using any suitable medium, including but not limited to wires, optical cables, RF (radio frequency), etc., or any suitable combination thereof.

[0215] In some embodiments, the client and server can communicate using any currently known or later developed network protocol, such as HTTP (Hypertext Transfer Protocol), and can be interconnected with any form or medium of digital data communication (e.g., a communication network). Examples of communication networks include a local area network ("LAN"), a wide area network ("WAN"), an internet (e.g., the Internet), and a peer-to-peer network (e.g., an ad hoc peer-to-peer network), as well as any currently known or later developed network.

[0216] The computer-readable medium may be included in the electronic device, or may exist independently without being incorporated into the electronic device.

[0217] The computer-readable medium carries one or more programs. When the one or more programs are executed by the electronic device, the electronic device executes the method for processing the composite component.

[0218] Computer program code for performing the operations of the present disclosure may be written in one or more programming languages, or a combination thereof, including, but not limited to, object-oriented programming languages ​​such as Java, Smalltalk, C++, and conventional procedural programming languages ​​such as "C" or similar programming languages. The program code may be executed entirely on the user's computer, partially on the user's computer, as a stand-alone software package, partially on the user's computer and partially on a remote computer, or entirely on the remote computer or server. In cases involving a remote computer, the remote computer may be connected to the user's computer through any type of network, including a local area network (LAN) or a wide area network (WAN), or may be connected to an external computer (e.g., through the Internet using an Internet service provider).

[0219] The flowcharts and block diagrams in the accompanying drawings illustrate the possible implementation architecture, functions and operations of the systems, methods and computer program products according to various embodiments of the present disclosure. In this regard, each box in the flowchart or block diagram can represent a module, program segment, or a part of code, and the module, program segment, or a part of code contains one or more executable instructions for realizing the specified logical function. It should also be noted that in some alternative implementations, the functions marked in the box can also occur in a different order than that marked in the accompanying drawings. For example, two boxes represented in succession can actually be executed substantially in parallel, and they can sometimes be executed in the opposite order, depending on the functions involved. It should also be noted that each box in the block diagram and / or flowchart, and the combination of the boxes in the block diagram and / or flowchart, can be implemented with a dedicated hardware-based system that performs the specified function or operation, or can be implemented with a combination of dedicated hardware and computer instructions.

[0220] The units involved in the embodiments described in this disclosure may be implemented in software or hardware. The name of a unit / module does not necessarily limit the unit itself. For example, a voice data acquisition module may also be described as a "data acquisition module."

[0221] The functions described above herein may be performed, at least in part, by one or more hardware logic components. For example, and without limitation, exemplary types of hardware logic components that may be used include: field programmable gate arrays (FPGAs), application specific integrated circuits (ASICs), application specific standard products (ASSPs), systems on chip (SOCs), complex programmable logic devices (CPLDs), and the like.

[0222] In the context of the present disclosure, a machine-readable medium can be a tangible medium that can contain or store a program for use by or in conjunction with an instruction execution system, device or equipment. A machine-readable medium can be a machine-readable signal medium or a machine-readable storage medium. A machine-readable medium can include, but is not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, device or equipment, or any suitable combination of the foregoing. A more specific example of a machine-readable storage medium can include an electrical connection based on one or more lines, a portable computer disk, a hard disk, a random access memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing.

[0223] It should be noted that the various embodiments in this specification are described in a progressive manner, with each embodiment focusing on the differences from other embodiments. Reference can be made to the common and similar parts between the various embodiments. For the systems or devices disclosed in the embodiments, since they correspond to the methods disclosed in the embodiments, the description is relatively simple, and the relevant parts can be referred to the method description.

[0224] It should be understood that in the present disclosure, "at least one (item)" refers to one or more, and "plurality" refers to two or more. "And / or" is used to describe the association relationship of associated objects, indicating that three relationships may exist. For example, "A and / or B" can mean: only A exists, only B exists, and A and B exist at the same time, where A and B can be singular or plural. The character " / " generally indicates that the previous and next associated objects are in an "or" relationship. "At least one of the following items" or similar expressions refers to any combination of these items, including any combination of single items or plural items. For example, at least one of a, b or c can mean: a, b, c, "a and b", "a and c", "b and c", or "a and b and c", where a, b, c can be single or multiple.

[0225] It should also be noted that, in this document, relational terms such as first and second, etc., are used only to distinguish one entity or operation from another entity or operation, and do not necessarily require or imply any such actual relationship or order between these entities or operations. Moreover, the terms "comprises," "comprising," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or device comprising a series of elements includes not only those elements, but also other elements not explicitly listed, or elements inherent to such process, method, article, or device. In the absence of further limitations, an element defined by the phrase "comprising a ..." does not exclude the presence of additional identical elements in the process, method, article, or device comprising the element.

[0226] The steps of the methods or algorithms described in conjunction with the embodiments disclosed herein may be implemented directly using hardware, a software module executed by a processor, or a combination of the two. The software module may be placed in a random access memory (RAM), internal memory, read-only memory (ROM), electrically programmable ROM, electrically erasable programmable ROM, registers, a hard disk, a removable disk, a CD-ROM, or any other form of storage medium known in the art.

[0227] The above description of the disclosed embodiments is intended to enable one skilled in the art to implement or use the present disclosure. Various modifications to these embodiments will be readily apparent to one skilled in the art, and the general principles defined herein may be implemented in other embodiments without departing from the spirit or scope of the present disclosure. Therefore, the present disclosure is not limited to the embodiments shown herein, but is intended to be construed in the widest manner consistent with the principles and novel features disclosed herein.

Claims

1. A method for processing a composite component, comprising: Determine the composite component to be generated; The composite component to be generated includes a target subcomponent, and the composite component to be generated corresponds to a composite component creation function; In response to an attribute adding operation on the target subcomponent in the to-be-generated composite component, adding each attribute of the target subcomponent to an input parameter of the composite component creation function; A target composite component is generated based on the composite component creation function and the input parameters; wherein each property of the target subcomponent included in the target composite component is editable.

2. The method according to claim 1, wherein: The composite component to be generated corresponds to a reference component property control; in response to the property adding operation of the target subcomponent in the composite component to be generated, each property of the target subcomponent is added to the input parameter of the composite component creation function, including: In response to a triggering operation on a reference component property control corresponding to the composite component to be generated, displaying a reference component property page corresponding to the composite component to be generated; In response to a selection operation on a label of the target subcomponent in the reference component property page, each property of the target subcomponent is added to the input parameters of the composite component creation function.

3. The method according to claim 1, wherein: The composite component to be generated corresponds to a reference component property control, each property of the target subcomponent includes a target property, and the method further includes: In response to a triggering operation on a reference component property control corresponding to the composite component to be generated, displaying a reference component property page corresponding to the composite component to be generated; In response to a selection operation on a label of the target subcomponent in the reference component property page and a selection operation on the target property in the reference component property page, adding the target property of the target subcomponent to the input parameters of the composite component creation function; A target composite component is generated based on the composite component creation function and the input parameters; wherein the target properties of the target subcomponents included in the target composite component are editable.

4. The method according to claim 1 or 2, further comprising: In response to an add operation on the target composite component, displaying the target composite component; In response to a trigger operation on a target subcomponent included in the target composite component, a property editing area corresponding to the target subcomponent is displayed; the property editing area corresponding to the target subcomponent displays various editable properties of the target subcomponent; In response to an editing operation on the properties of the target subcomponent in the property editing area corresponding to the target subcomponent, the edited target subcomponent is redisplayed.

5. The method according to claim 4, wherein: The target subcomponent is a slot component, and a slot area corresponding to the slot component is displayed in the target composite component; the method further includes: In response to an add operation on a component in the slot area, the component is added to the slot area. slot area.

6. The method according to claim 4, further comprising: In response to an unbinding operation on the added target composite component, displaying the unbound subcomponents of the target composite component; The properties of the subcomponents after unbinding the target composite component are editable; In response to a triggering operation on a subcomponent after the target composite component is unbound, a property editing area corresponding to the subcomponent is displayed; the property editing area corresponding to the subcomponent displays various editable properties of the subcomponent; In response to an editing operation on the properties of the subcomponent in the property editing area corresponding to the subcomponent, the edited subcomponent is redisplayed.

7. The method according to claim 6, wherein: The composite component corresponds to an unbinding control, and in response to the unbinding operation of the added target composite component, the unbound subcomponents of the target composite component are displayed, including: In response to the triggering operation of the unbinding control corresponding to the target composite component, each sub-component after the target composite component is unbound is displayed.

8. The method according to claim 6, further comprising: In response to a combination operation on at least two subcomponents after unbundling the target composite component, obtaining a composite component composed of the at least two subcomponents; The composite component composed of the at least two subcomponents is automatically added to the composite component list; the composite component list displays the generated composite component.

9. The method according to claim 8, wherein: The step of obtaining a composite component composed of the at least two subcomponents in response to the combination operation of the at least two subcomponents after the target composite component is unbound includes: In response to a selection operation on at least two subcomponents after the target composite component is unbound and a trigger operation on a combination control corresponding to at least two subcomponents in the target composite component, a composite component composed of the at least two subcomponents is obtained.

10. The method according to claim 8 or 9, wherein: The step of obtaining a composite component composed of the at least two subcomponents in response to the combination operation of the at least two subcomponents after the target composite component is unbound includes: In response to a combination operation on at least two subcomponents after unbinding the target composite component, a composite component to be configured consisting of the at least two subcomponents is obtained; the composite component to be configured corresponds to a configuration control; In response to a triggering operation on a configuration control corresponding to the composite component to be configured, displaying the composite component to be configured and a configuration area corresponding to the composite component to be configured; In response to a configuration operation on the composite component to be configured in a configuration area corresponding to the composite component to be configured, a composite component consisting of the at least two sub-components is obtained.

11. A composite component processing device, comprising: A determination unit is configured to determine a composite component to be generated; the composite component to be generated includes a target subcomponent, and the composite component to be generated corresponds to a composite component creation function; A first adding unit is configured to add each attribute of the target subcomponent to the input parameter of the composite component creation function in response to the attribute adding operation of the target subcomponent in the composite component to be generated; The first generating unit is configured to generate a target composite component based on the composite component creation function and the input parameters; wherein each property of the target subcomponent included in the target composite component is editable.

12. An electronic device comprising: one or more processors; a storage device having one or more programs stored thereon, When the one or more programs are executed by the one or more processors, the one or more processors implement the composite component processing method as described in any one of claims 1-10.

13. A computer-readable storage medium, wherein: A computer program is stored thereon, and when the computer program is executed by a processor, the method for processing a composite component as claimed in any one of claims 1 to 10 is implemented.

Images