Component processing method, related device, storage medium and program product

By separating logic code and style presentation into different processing layers and using style access interfaces to generate target components, the complexity and inefficiency caused by style variable dependencies in traditional application development are solved, enabling rapid adaptive modification and efficient development.

CN120994187APending Publication Date: 2025-11-21TENCENT TECHNOLOGY (SHENZHEN) CO LTD
View PDF 0 Cites 0 Cited by

Patent Information

Application Number
CN202410631089.5
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2024-05-20
Publication Date
2025-11-21

Smart Images

  • Figure CN120994187A_ABST
    Figure CN120994187A_ABST
Patent Text Reader

Abstract

The embodiment of the invention discloses a component processing method, a related device, a storage medium and a program product, and aims to reduce development difficulty and complexity, improve development efficiency, quickly and adaptively modify component styles and improve user experience. The method comprises the following steps: acquiring a first request, wherein the first request comprises N first style access interfaces and N component style values required by M themes respectively; calling N first style variables in the first processing layer based on the N first style access interfaces; for each theme, processing the N first style variables based on the N component style values to obtain N first style expressions corresponding to each theme; calling N first logic codes in a second processing layer based on the N first style variables; for each theme, the N first style expressions are fused with N first logic codes needed by each theme, N target components needed by each theme are generated, and the N target components are used for generating application programs corresponding to the themes.
Need to check novelty before this filing date? Find Prior Art

Description

TECHNICAL FIELD

[0001] Embodiments of the present application relate to the technical field of computer, in particular to a component processing method, related apparatus, storage medium and program product. BACKGROUND

[0002] With the rapid development of information technology, application programs (APPs) have become an indispensable part of people's daily life and work. However, the traditional application program development method often has problems such as low efficiency, resource waste, and poor maintainability. Therefore, in recent years, the industry has gradually shifted its focus to the use of pre-made component libraries to achieve the combination and reuse of components such as buttons, forms, and navigation menus, in order to quickly build application programs.

[0003] However, in the process of building application programs based on component libraries, the traditional method basically relies on Sass (Syntactically Awesome Stylesheets) or Less and other style libraries to achieve this. These style libraries provide a large number of pre-made components, allowing developers or other users to use these pre-made components to build application programs, or to build application programs by customizing or extending based on pre-made components. However, using pre-made components in the pre-made component library usually requires manually exposing the corresponding style variables of the components, which provides developers or users with an entry point for modifying the component styles. That is, in the traditional method, modifying and adjusting the corresponding component styles requires relying on the exposed style variables. If the style variables are not fully exposed, developers or users need to spend a lot of time studying the logic code of the pre-made components, which not only increases the complexity and difficulty of building application programs, reduces the development efficiency of application programs, but also increases the difficulty of adaptively modifying component styles, resulting in poor user experience. SUMMARY

[0004] Embodiments of the present application provide a component processing method, related apparatus, storage medium and program product, which not only reduces the development difficulty and complexity, improves the development efficiency of application programs, but also quickly adaptively modifies the component styles, and improves the user experience.

[0005] In view of this, the present application provides a component processing method. The method comprises: obtaining a first request, the first request comprising N first style access interfaces and N component style values required by M themes respectively, there being a one-to-one mapping relationship between the N first style access interfaces and N first style variables, each component style value being used to represent a value condition of a first style variable, each first style variable being used to represent a style performance of a corresponding component, N and M being integers greater than or equal to 1; calling the N first style variables based on the N first style access interfaces at a first processing layer; for each theme, processing the N first style variables based on the N component style values to obtain N first style performances corresponding to each theme; calling N first logic codes based on the N first style variables at a second processing layer, the N first logic codes being used to indicate code logic of the N first style performances, the first processing layer and the second processing layer being two different processing layers; for each theme, fusing the N first style performances with N first logic codes required by each theme respectively to generate N target components required by each theme, the N target components being used to generate an application program corresponding to the theme.

[0006] The present application provides a component processing device. The component processing device comprises an obtaining module, a calling module, a processing module and a generating module.

[0007] The obtaining module is configured to obtain a first request, the first request comprising N first style access interfaces and N component style values required by M themes respectively, there being a one-to-one mapping relationship between the N first style access interfaces and N first style variables, each component style value being used to represent a value condition of a first style variable, each first style variable being used to represent a style performance of a corresponding component, N and M being integers greater than or equal to 1.

[0008] The calling module is configured to call the N first style variables based on the N first style access interfaces at a first processing layer.

[0009] The processing module is configured to, for each theme, process the N first style variables based on the N component style values to obtain N first style performances corresponding to each theme.

[0010] The calling module is configured to call N first logic codes based on the N first style variables at a second processing layer, the N first logic codes being used to indicate code logic of the N first style performances, the first processing layer and the second processing layer being two different processing layers.

[0011] The generating module is configured to fuse, for each theme, the N first style representations with N first logic codes respectively required by each theme, to generate N target components required by each theme, and the N target components are used to generate an application program corresponding to the theme.

[0012] In a possible design, in another implementation of another aspect of the embodiment of the application,

[0013] The obtaining module is specifically configured to obtain a plurality of candidate components and extract component style variables of each candidate component and logic codes of each candidate component before the N first style variables are called in the first processing layer based on the N first style access interfaces.

[0014] The processing module is specifically configured to:

[0015] save the component style variables of each candidate component in the first processing layer, and save the logic codes of each candidate component in the second processing layer;

[0016] perform interface abstraction processing on the component style variables of each candidate component in the first processing layer, to obtain a second style access interface corresponding to each component style variable;

[0017] when the first style access interface matches the second style access interface, determine the component style variable corresponding to the matched second style access interface as the first style variable corresponding to the first style access interface.

[0018] In another possible design, in another implementation of another aspect of the embodiment of the application, the M themes include a first theme, and the first theme is any one of the M themes; the processing module is specifically configured to:

[0019] for the first theme, perform assignment processing on the N component style values to the N first style variables, to obtain N first style representations corresponding to the first theme.

[0020] In another possible design, in another implementation of another aspect of the embodiment of the application, the processing module is specifically further configured to:

[0021] after the assignment processing on the N component style values to the N first style variables for the first theme to obtain the N first style representations corresponding to the first theme, display the N first style representations corresponding to the first theme on the first visual display area.

[0022] In another possible design, in another implementation of another aspect of the embodiment of the application, the M themes further include a second theme, and the first theme and the second theme are different; the processing module is specifically further configured to:

[0023] For the second theme, the N first style performances corresponding to the first theme are loaded based on the theme inheritance method to obtain N first style performances corresponding to the second theme.

[0024] In another possible design, in another implementation of another aspect of the embodiment of the application, the processing module is specifically further configured to:

[0025] After the N first style performances corresponding to the first theme are loaded based on the theme inheritance method for the second theme to obtain N first style performances corresponding to the second theme, the N first style performances corresponding to the second theme are displayed on the second visual display area.

[0026] In another possible design, in another implementation of another aspect of the embodiment of the application,

[0027] The acquisition module is specifically further configured to: after the N first style performances corresponding to the first theme are loaded based on the theme inheritance method to obtain N first style performances corresponding to the second theme, acquire a style update request, the style update request including style update information;

[0028] The processing module is specifically further configured to: based on the style update information in the style update request, update the N first style performances corresponding to the second theme to obtain target style performances corresponding to the second theme.

[0029] In another possible design, in another implementation of another aspect of the embodiment of the application, the style update information includes a target update value of a target variable, the target variable being any one or more of the N first style variables in the second theme; the processing module is specifically configured to:

[0030] Adjust a component style value of the target variable to the target update value of the corresponding target variable;

[0031] Based on the target update value of the target variable, perform value assignment processing on the target variable to obtain the target style performances corresponding to the second theme.

[0032] In another possible design, in another implementation of another aspect of the embodiment of the application, the processing module is specifically further configured to:

[0033] After the value assignment processing is performed on the target variable based on the target update value of the target variable to obtain the target style performances corresponding to the second theme, the target style performances corresponding to the second theme are displayed on the third visual display area.

[0034] In another possible design, in another implementation of another aspect of the embodiment of the application, the processing module is specifically further configured to:

[0035] updating the N first style variables in the first processing layer to obtain second style variables;

[0036] updating the N first style performances corresponding to each theme based on the second style variables to obtain second style performances corresponding to each theme;

[0037] updating the N first logic codes based on the second style variables to obtain second logic codes;

[0038] if the second style performances cannot be correctly displayed when the second logic codes are run, displaying style prompt information, the style prompt information being used to prompt that one or more of the second logic codes and the second style performances have update errors.

[0039] In another possible design, in another implementation of another aspect of the embodiment of the present application, the processing module is specifically further configured to:

[0040] determining a processing strategy based on the style prompt information after the style prompt information is displayed;

[0041] processing one or more of the second logic codes and the second style performances based on the processing strategy.

[0042] In another possible design, in another implementation of another aspect of the embodiment of the present application, the first style variables include one or more of specific style variables and general style variables.

[0043] Another aspect of the present application provides an assembly processing device, including a memory and a processor, the memory stores a computer program, and the processor implements the method of each aspect described above when executing the computer program.

[0044] Another aspect of the present application provides a computer readable storage medium, which stores a computer program, and the computer program is executed by a processor to implement the method of each aspect described above.

[0045] Another aspect of the present application provides a computer program product, which includes a computer program, and the computer program is executed by a processor to implement the method of each aspect described above.

[0046] From the above technical solutions, it can be seen that the embodiment of the present application has the following advantages:

[0047] In the embodiment of the present application, the first request includes N component style values required by N first style access interfaces and M themes respectively. There is a one-to-one mapping relationship between the described N first style access interfaces and N first style variables. In addition, each component style value is used to represent the value of a first style variable, and each first style variable is used to represent the style performance of the corresponding component. Therefore, after obtaining the first request, N first style variables are called in the first processing layer based on the N first style access interfaces. Moreover, for each theme, N first style performances corresponding to each theme are obtained by processing N first style variables based on N component style values. Similarly, after calling N first style variables, N first logic codes are called in the second processing layer based on N first style variables. The N first logic codes can be used to indicate the code logic of the N first style performances. The first processing layer and the second processing layer are two different processing layers. Thus, for each theme, N first style performances and N first logic codes required by each theme are fused to generate N target components required by each theme, and the N target components are used to generate an application corresponding to the theme.

[0048] That is, in the present application, on the one hand, the logical code and the first style performance are designed in a hierarchical manner through layer separation, so that the first style performance only needs to depend on the first style variable called through the first style access interface, and does not need to depend on the specific first logic code of the component. Not only the readability and maintainability of the first logic code are improved, but also the developer or user can focus on the adaptability of the component style in the first processing layer, without the need to spend a lot of cost to study the first logic code in the second processing layer to change the component style, thereby reducing the complexity and difficulty of building the application and improving the development efficiency. On the other hand, in the present application, the first style access interface is used to realize the unified access to the style variable, without the need to pay attention to whether the style variable is exposed, so that the developer or user can also focus on the update of the component style involved in the business theme of the user, thereby reducing the difficulty of modifying the component style and improving the user experience. BRIEF DESCRIPTION OF DRAWINGS

[0049] In order to more clearly illustrate the technical solutions in the embodiments of the present application or the prior art, the following will briefly introduce the drawings needed to be used in the embodiments or prior art description. Obviously, the drawings in the following description are only some embodiments of the present application, and for those skilled in the art, other drawings can also be obtained without creative labor based on these drawings.

[0050] Figure 1 An embodiment environment diagram of the component processing method in the present application;

[0051] Figure 2 An optional schematic diagram of a component processing device in an embodiment of the present application is shown.

[0052] Figure 3 An optional schematic diagram of a component processing method in an embodiment of the present application is shown.

[0053] Figure 4 An optional schematic diagram of a style expression of the first subject provided by the present application is shown.

[0054] Figure 5 An optional schematic diagram of a style expression of the second subject provided by the present application is shown.

[0055] Figure 6 Another optional schematic diagram of a style expression of the second subject provided by the present application is shown.

[0056] Figure 7 Another optional schematic diagram of a style expression of the second subject provided by the present application is shown.

[0057] Figure 8 An optional schematic diagram of a component processing device in an embodiment of the present application is shown.

[0058] Figure 9 An optional schematic diagram of a component processing device in an embodiment of the present application is shown. DETAILED DESCRIPTION

[0059] The embodiments of the present application provide a component processing method, related device, storage medium and program product, which not only reduce development difficulty and complexity, improve development efficiency of the application program, but also quickly adaptively modify component style and improve user experience.

[0060] It can be understood that in the specific embodiments of the present application, data related to user information is involved, and when the above embodiments of the present application are applied to specific products or technologies, user permission or consent is required, and the collection, use and processing of related data need to comply with relevant laws, regulations and standards of countries and regions.

[0061] The technical solutions in the embodiments of the present application will be clearly and completely described below with reference to the drawings in the embodiments of the present application. Obviously, the described embodiments are only part of the embodiments of the present application, not all the embodiments. Based on the embodiments in the present application, all other embodiments obtained by those of ordinary skill in the art without creative labor fall within the scope of protection of the present application.

[0062] The terms "first", "second", "third", "fourth", and the like in the description and in the claims of the present application, and also above-mentioned drawings (if any), are used for distinguishing between similar objects and not necessarily for describing a specific sequential or chronological order. It is to be understood that the use of the terms so-termed "first", "second", "third", "fourth", etc., if any, are interchangeable under appropriate circumstances and embodiments of the application described herein are capable of functioning in other sequences than the one depicted or claimed herein. Furthermore, the terms "comprise", "comprising", "have", "having", "include", "including", "contain", "containing", and any variations thereof, are intended to cover a non-exclusive inclusion, such that a process, method, system, product, or apparatus that comprises, has, includes, contains a list of steps or elements, but not those not expressly listed or inherent to such process, method, product, or apparatus, is feasible.

[0063] With the rapid development of information technology, different application programs suitable for different scenarios are gradually developed based on different business needs or market needs. For example, shopping software for purchasing goods, social software for realizing chat, sharing and other functions, service software for providing catering, tourism, travel and other services, or other search software providing search, query and other functions, and the like. It can be seen that application programs provide a series of conveniences for users' life and work, and have gradually become an indispensable part of people's daily life and work.

[0064] In recent years, the industry has gradually turned its attention to the combination and reuse of components such as buttons, forms, navigation menus, etc. through a prefabricated component library, to quickly build an application program.

[0065] With the increasing demand for personalization, the style and interface design of the application program becomes particularly important. By updating and adjusting the component style of the required components of the application program, users and developers can build different appearances of the application program based on different scene needs to adapt to the rapidly changing market needs.

[0066] However, in the process of building an application program using prefabricated components in a component library and changing component styles, it is usually necessary to rely on manually exposing the style variables of the prefabricated components in a prefabricated style library such as Sass or Less, which can provide developers or users with an entry for modifying component styles. That is, in the traditional way, modifying and adjusting the corresponding component style needs to rely on the exposed style variables. If the style variables are not fully exposed, developers or users need to spend a lot of time and cost to study the logic code of the prefabricated components. On the one hand, it not only increases the complexity and difficulty of building an application program, but also reduces the development efficiency of the application program. On the other hand, it also increases the difficulty of adaptively modifying the component style, resulting in poor user experience.

[0067] To solve the above-mentioned technical problems, the embodiment of the present application provides a component processing method. In the component processing method, the first logic code and the first style presentation are designed in a layered manner through layer separation, so that the first style presentation only needs to depend on the first style variable called through the first style access interface, and does not need to depend on the specific first logic code of the component. It can be seen that through the layered design, not only the readability and maintainability of the first logic code are improved, but also the developer or user can focus on the adaptability of the component style in the first processing layer, without the need to spend a lot of cost to study the first logic code in the second processing layer to change the component style, thereby reducing the complexity and difficulty of building the application program and improving the development efficiency. On the other hand, in the present application, the first style access interface is used to realize the unified access mode of the style variable, without the need to pay attention to whether the style variable is exposed, so that the developer or user can also focus on the update of the component style involved in the business theme of the user, thereby reducing the difficulty of modifying the component style and improving the user experience. The component processing method of the present application includes at least one of the following scenarios when applied.

[0068] Scenario one: customized enterprise application

[0069] In an enterprise application, different departments or user groups often have specific requirements for the style of the application program. Based on the component processing method provided by the present application, the logic code and the style presentation of the component can be separated in different processing layers. In this way, the enterprise can generate a target component corresponding to a theme according to the needs of the enterprise for different themes by calling the style variable through the style access interface and associating the logic code with the style presentation based on the style variable, and further customize the application program interface that meets the brand image, operation habit and business process based on the target component, thereby improving the user experience and work efficiency.

[0070] Scenario two: rapid prototyping

[0071] In the early stage of product development, rapid prototyping is an important stage of verifying product concepts and collecting user feedback. Based on the component processing method provided by the present application, the logic code and the style presentation of the component can be separated in different processing layers. The designer can call the style variable through the style access interface according to the needs of the designer for different themes. After calling the style variable, the logic code is associated with the style presentation based on the style variable, so as to quickly generate a target component corresponding to a theme, and further quickly build a high-fidelity product prototype based on the target component. Of course, the product requirements can also be iterated and optimized for many times in a short time to build product styles required by different product requirements.

[0072] Scenario three: cross-platform application development

[0073] With the popularity of mobile Internet, cross-platform application development has become a trend. However, the interface style and style between different platforms are different, which brings challenges to developers. Based on the method provided by the component processing of the application, the logical code and style of the component can be separated in different processing layers. In this way, the developer can call the style variable by using the style access interface according to the demand of each platform for different themes, and associate and fuse the logical code with the style expression based on the style variable, so as to quickly generate the target component corresponding to different themes in multiple platforms. Further, the target component required by different themes can be designed once to adapt to the interface style of multiple platforms, and the cross-platform application can be quickly deployed through simple configuration.

[0074] Scenario four: marketing activities and promotion activities

[0075] In marketing activities and promotion activities, it is crucial to quickly respond to market changes and user needs. Based on the method provided by the component processing of the application, the logical code and style of the component can be separated in different processing layers. In this way, the enterprise can call the style variable by using the style access interface according to the demand of each platform for different themes, and associate and fuse the logical code with the style expression based on the style variable, so as to quickly generate the target component corresponding to different themes. Further, the target component can quickly create the interface style of the application program that meets the theme of the activity, attract the attention of users and improve the participation of the activity. In addition, the technology also supports real-time updating and replacing the component style, making the marketing activities more flexible and timely.

[0076] Scenario five: education and training and demonstration tools

[0077] In the process of education and training and demonstration, using intuitive and easy-to-understand interface can help improve teaching effect and demonstration effect. Based on the method provided by the component processing of the application, the logical code and style of the component can be separated in different processing layers. In this way, teachers or other educators can call the style variable by using the style access interface according to the demand of different teaching themes, and associate and fuse the logical code with the style expression based on the style variable, so as to quickly generate the target component corresponding to different teaching themes. Further, the target component corresponding to different teaching themes can quickly create the interface style of the application program that meets the teaching content and demonstration needs, so that students or audiences can more easily understand and accept the learned content.

[0078] It should be noted that the above application scenarios are only examples, and the method of component processing provided by the embodiment can also be applied to other scenarios, which are not limited here.

[0079] For example, the method provided by the application can be applied to Figure 1The illustrated implementation environment includes a component processing device 110. The component processing device 110 involved in the present application includes but is not limited to a terminal device or a server, etc. Figure 1 The illustrated implementation environment includes a component processing device 110. The component processing device 110 involved in the present application includes but is not limited to a terminal device or a server, etc.

[0080] For example, the terminal device can include but is not limited to a mobile phone, a tablet computer, a notebook computer, a desktop computer, a smart voice interaction device, a smart home appliance, a vehicle-mounted terminal, an aircraft, etc. Among them, the client is deployed on the component processing device 110, and the client can run on the component processing device 110 in the form of a browser, or run on the component processing device 110 in the form of an independent application (APP), etc.

[0081] The server involved can be a standalone physical server, or a server cluster or distributed system composed of multiple physical servers, or a cloud server providing cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communication, middleware services, domain name services, security services, content delivery networks (CDNs), and basic cloud computing services such as big data and artificial intelligence (AI) platforms.

[0082] Optionally, in the above Figure 1 In the illustrated implementation environment, the component processing device 110 can also be connected to a database 120. Among them, the database 120 can be simply regarded as an electronic file cabinet - a place to store electronic files, and users can add, query, update, delete, etc. The data in the file. The so-called "database 120" is a collection of data stored together in a certain way, shared by multiple users, with as little redundancy as possible, and independent of each other from application programs.

[0083] A database management system (DBMS) is a computer software system that manages databases, typically providing storage, retrieval, security, backup, and other functions. A database management system can be classified according to the model it supports for the database it manages, such as the relational model, the XML model, or according to the type of computer it is designed to run on, such as a server cluster, a mobile phone, or according to the query language it supports, such as SQL, XQuery, or according to the performance emphasis, such as maximum size, maximum speed, or other criteria. Regardless of the classification, some DBMSs are able to cross categories, such as supporting multiple query languages.

[0084] In the present application, the database 120 can be used to store the corresponding style variables and logic code of the components, etc. Of course, the storage location of the style variables, logic code and other data is not limited to the database 120, for example, it can also be stored in the component processing device 110, a distributed file system of a server or a blockchain, etc. The specific application is not limited.

[0085] Optionally, for the component processing device 110 shown in the above Figure 1 , it can include at least four processing layers. Please refer to Figure 2 , which shows a schematic diagram of an optional structure of the component processing device provided by the present application. As Figure 2 indicated, the component processing device 110 includes at least a first processing layer, a second processing layer, a third processing layer and a fourth processing layer.

[0086] For the first processing layer mentioned above, it is also sometimes referred to as a style abstraction layer. The abstraction layer is a design pattern that can divide a complex system into multiple levels, each of which only concerns its own function and style, without the need to understand the details of other levels. The style abstraction layer mentioned in the present application separates the logic code of the component and the component style. In the style abstraction layer, the style variables (including but not limited to general styles and specific styles) of the component can also be abstracted into a style access interface. By separating the style representation of the component style and the logic code through the style abstraction layer, the style representation can be modified through the style abstraction layer without affecting other codes, greatly improving the maintainability of the code. Moreover, providing a unified style access interface for each component can access the style variables without paying attention to the code, and thus the style representation can be understood without knowing the logic code.

[0087] In the present application, the component processing device 110 can implement the operation of separating the component style of the component from the logic code, and calling the corresponding style variable. For example, as shown in Figure 2 the style variable of component A, the style variable of component B, the style variable of component C, the style variable of the general component, and the style variable of the component can be abstracted into the corresponding style access interface, and then the style variable of the N components required by each theme can be called in the sample abstraction layer. For example, the style variable can be called by using the hooks function of React.

[0088] In addition, the second processing layer described is also sometimes referred to as the component logic layer. The component logic layer refers to the part that implements the functions and behaviors of the component, including but not limited to processing the input of the user, managing and updating the state of the component, and implementing other functions of the component, etc. In the present application, by designing the component logic layer, the logic code of each component can be stored in the component logic layer, and the component logic layer does not contain any style representation of the component, so that the logic code of the component is clearer and easier to test and maintain. For example, if the logic code of the component needs to be modified, only the component logic layer needs to be concerned, and the style representation does not need to be concerned. In the present application, the component processing device 110 can implement the operation of calling the logic code of the component, and modifying and updating the logic code of the component. For example, as shown in Figure 2 the logic code of component A, the logic code of component B, and the like can be called based on the style variable of the component.

[0089] In addition, the third processing layer mentioned above is also sometimes referred to as the theme layer. In software development, the theme layer refers to the part that defines the visual representation of the application program, such as including but not limited to the color, font, layout, and the like of the style. In the present application, by designing the theme layer, the style representation of different components can be provided for each theme, and then the overall style of the application program under different themes can be changed by switching the theme. In addition, in the theme layer, the style representation of a certain theme can also be inherited to another theme, and only a slight modification is needed on the basis of another theme, without the need to redefine the style representation of all components, so that the overall style of the application is consistent while some specific parts of certain components can be personalized. In the present application, the component processing device 110 can implement the operation of how to formulate the corresponding component style for each theme.

[0090] For the fourth processing layer mentioned above, it can also be referred to as a container layer. The container layer refers to the part that manages and coordinates various components, including but not limited to managing the life cycle of the components, processing communication between the components, and injecting corresponding themes into each component according to configuration information, etc. In this application, the component processing device 110 can integrate logical code with style presentation to implement the operation of injecting the style presentation of different themes into the logical code of the corresponding component. In this way, the style presentation of the component can be dynamically changed according to the user's operation or other conditions during running, or the theme of the application program can also be dynamically changed, without modifying the logical code of the component, improving the flexibility of the code, and making the style presentation of the component more easily managed and maintained.

[0091] In addition, in this container layer, the logical code and style presentation of all components can be integrated, which can realize flexible combination of the required components under different themes according to the specific business needs, to build an application program corresponding to different themes. Not only improves the reusability of the code, but also can more flexibly meet different business needs.

[0092] In combination with the above Figure 2 , for the implementation environment shown in the above Figure 1 , in step A1, the component processing device 110 obtains a first request. The first request includes N first style access interfaces and N component style values required by M themes respectively. In step A2, the component processing device 110 can call N first style variables in the first processing layer based on the N first style access interfaces. In step A3, the component processing device 110 can process the N first style variables based on the N component style values for each theme, for example, in the third processing layer, to obtain N first style presentations corresponding to each theme. In step A4, the component processing device 110 can call N first logical codes based on the N first style variables, for example, in the second processing layer. In step A5, the component processing device 110 can fuse the N first style presentations with the N first logical codes required by each theme respectively for each theme, for example, in the fourth processing layer, to generate N target components required by each theme. Thus, after generating the N target components, the component processing device can generate an application program corresponding to the theme using the N target components.

[0093] In combination with the above introduction, the component processing method in this application will be introduced below. Please refer to Figure 3 The component processing method in the embodiment of the present application can be executed by the component processing device, and the method of the present application comprises:

[0094] 301, obtaining a first request, the first request including N first style access interfaces and N component style values required by M themes respectively.

[0095] In one or more embodiments, in the process of constructing an application, it is necessary to determine the components required by the application, such as component A, component B, and the like. In addition, for each component, it contains a style representation of the component style and also contains a logic code. The representation of the component style can reflect the visual style presentation of the component, and the logic code can reflect the code logic of the component style. Therefore, in the process of determining the required components, it is usually necessary to first obtain the style representation and logic code of each component.

[0096] Based on this, in order to solve the problems of increased development complexity and difficulty caused by the need to manually expose the style variables of the components in the traditional way, the present application defines a style access interface (such as the first style access interface, the second style access interface, and the like mentioned later) to provide a unified access method for component styles, so as to call the style variables through the style access interface, thereby expanding the application to scenarios where the style variables are not exposed.

[0097] Therefore, the first request can be obtained based on the needs of the application. The first request includes N first style access interfaces and N component style values required by M themes respectively, and N and M are integers greater than or equal to 1. That is, through the first request, the first style access interface used to access the first style variable later can be known, and the specific component style value of each first style variable can also be known.

[0098] It should be noted that there is a one-to-one mapping relationship between the N first style access interfaces and the N first style variables. In other words, one first style access interface corresponds to one first style variable.

[0099] For example, in the case of N = 3, the first request includes 3 first style access interfaces. And the 3 first style access interfaces can include access interface 11, access interface 12, and access interface 13. In addition, the 3 first style variables include style variable 11, style variable 12, and style variable 13. Each of the 3 first style access interfaces corresponds to one of the 3 first style variables. For example, access interface 11 has a one-to-one mapping relationship with style variable 11; access interface 12 has a one-to-one mapping relationship with style variable 12; similarly, access interface 13 corresponds to a style variable 13, which is not specifically limited in the present application.

[0100] It should be noted that the first style variable mentioned in the present application can be used to represent the style representation of the corresponding component.

[0101] For example, for a component A, a component B, etc. required when constructing a certain application program, the style performance of the component can include color performance, such as but not limited to orange, green, blue, etc. At this time, the color variable can be understood as the first style variable corresponding to the component, that is, the color performance of the component. Alternatively, for the components A, B, etc. mentioned, the style performance of the component can also include operation performance, etc. Through the operation variable, it can be reflected that different display forms are used to reflect the called and executed component in the process of calling and executing the component, such as the process of loading the component, etc. At this time, the operation variable can be understood as the first style variable corresponding to the component, that is, the operation performance of the component. Specifically, in actual application, other style performances of components can also be included, which are not limited in the present application.

[0102] In one or more embodiments, the first style variable mentioned in the present application includes one or more of a specific style variable and a general style variable.

[0103] For the general style variable, it can be used to represent the general style widely used in the application program, such as but not limited to font size, line height, spacing, input box, drop-down menu, button shape, etc.

[0104] For the specific style variable, it can be used to represent the specific style of the internal elements of each of the N components required by the application program, so as to realize the specific function and appearance of the component. For example, the specific style can include but is not limited to component structure style, component interaction style, component state style, etc. Among them, the component structure style can be used to define the layout and position of the internal elements of the component. The component interaction style includes but is not limited to color change when the button is triggered, border color when the input box gets focus, etc. The component state style can include but is not limited to the style in different states such as active state, disabled state, error state, etc. of the component, which is not limited in the present application.

[0105] In addition, the N component style values required by each of the M themes can indicate the specific value of the first style variable of each component in the N components required by each theme. Through the component style value, the style value of the corresponding first style variable can be reflected.

[0106] For example, taking the color variable as the first style variable, for the component A required by the application program, the color variable in the component A can include but is not limited to orange, green, blue, etc. The specific color value is not limited in the present application.

[0107] It should be noted that the N component style values required by each of the M themes can be the same or different, and the application does not limit the specific implementation.

[0108] 302、invoke the N first style variables in the first processing layer based on the N first style access interfaces.

[0109] In one or more embodiments, since the style access interface is set to provide unified access to the component style, and one style access interface corresponds to the style variable of one component, after obtaining the N first style access interfaces in the first case, the N first style variables can be invoked in the first processing layer using the N first style access interfaces. As an illustrative description, one first style variable corresponding to one first style access interface is invoked from the first processing layer based on the first style access interface, and N invocations are performed to obtain N first style variables. The application does not limit the specific invocation manner.

[0110] It should be noted that the first processing layer mentioned herein can be understood with reference to the foregoing Figure 2 description, and specific details are not repeated.

[0111] Optionally, in one or more embodiments, the plurality of candidate components can also be obtained before invoking the N first style variables in the first processing layer based on the N first style access interfaces. Each candidate component includes corresponding component style variables and logic code.

[0112] At this time, after obtaining the plurality of candidate components, the component style variables of each candidate component and the logic code of each candidate component are extracted. In this way, by virtue of the foregoing layered design idea, the component style variables of each candidate component are saved in the first processing layer, and the logic code of each candidate component is saved in the second processing layer, so as to achieve layered design of the component style variables and the logic code of the candidate components. In addition, in the first processing layer, interface abstraction processing is also required for the component style variables of each candidate component to obtain the second style access interface corresponding to each component style variable.

[0113] In this way, in the process of invoking the N first style variables in the first processing layer based on the N first style access interfaces, the N first style access interfaces in the first request can be matched with the second style access interfaces of the candidate components, respectively. Then, in the case where each first style access interface is matched with the corresponding second style access interface in the candidate component, the component style variable corresponding to the matched second style access interface is determined as the first style variable corresponding to the first style access interface.

[0114] 303、for each theme, based on the N component style values, processing the N first style variables to obtain N first style representations corresponding to each theme.

[0115] In one or more embodiments, after the N first style variables are accessed based on the N first styles in the first processing layer, for each theme, the N first style variables also need to be processed based on the N component style values to determine the N first style representations corresponding to each theme. As an illustrative description, for each theme, each component style value can be assigned to the corresponding first style variable to obtain the N first style representations corresponding to each theme.

[0116] It should be noted that the N first style representations described can be understood as the specific representations of the component styles of the N components corresponding to each theme. For example, for any one of the M themes (e.g., theme 1), taking the color variable as the style variable, suppose theme 1 involves component A and component B, and the component style value of component A is "blue" and the component style value of component B is "orange". At this time, after assigning "blue" to the color variable in component A, the first style representation obtained is blue, i.e., the color of the component style of component A is blue. Similarly, after assigning "orange" to the color variable in component B, the first style representation obtained is orange, i.e., the color of the component style of component B is orange, which is not specifically limited in this application.

[0117] 304、based on the N first style variables, calling N first logic codes in a second processing layer, the N first logic codes being used to indicate the code logic of the N first style representations, the first processing layer and the second processing layer being two different processing layers.

[0118] In one or more embodiments, after the N first style variables are called in the first processing layer, the N first logic codes can also be called in the second processing layer based on the N first style variables. It should be noted that the N first logic codes can be used to indicate the code logic of the N first style representations. Or, a first logic code can reflect the logic situation of a first style representation.

[0119] For example, taking the N first style variables including style variable 11 to style variable 13 as an example, suppose that the first logic codes called based on style variable 11, style variable 12, and style variable 13 are logic code 11, logic code 12, and logic code 13, respectively. At this time, logic code 11 can be used to indicate the code logic of style representation 11, logic code 12 can be used to indicate the code logic of style representation 12, and logic code 13 can be used to indicate the code logic of style representation 13, which is not specifically limited in this application.

[0120] In addition, the first processing layer and the second processing layer are two different processing layers, and details can be referred to the foregoing description Figure 2 The foregoing description is understood, and details are not described herein.

[0121] It should be noted that the execution sequence of the step 303 and the step 304 is not limited in actual application, except that the step 303 is executed first and the step 304 is executed later as mentioned above. For example, in actual application, the step 304 can be executed first and the step 303 can be executed later, or the step 303 and the step 304 can be executed synchronously.

[0122] 305, for each theme, the N first style expressions are fused with the N first logic codes required by each theme respectively to generate N target components required by each theme, and the N target components are used to generate an application corresponding to the theme.

[0123] In one or more embodiments, for each theme, after the N first style expressions corresponding to each theme and the N first logic codes required by each theme are obtained, the N first style expressions corresponding to each theme and the N first logic codes required by each theme are fused to generate N target components required by each theme. As an illustrative description, for each theme, the corresponding N first style expressions can be injected into the corresponding N first logic codes by a style injection method to determine the N target components required by each theme. In this way, after the N target components required by each theme are obtained, for each theme, the corresponding N target components can be used to generate an application corresponding to the theme.

[0124] In the embodiments of the present application, on the one hand, the logic code and the first style expression are designed by layer separation, so that the first style expression only needs to depend on the first style variable called through the first style access interface, and does not need to depend on the specific first logic code of the component. This not only improves the readability and maintainability of the first logic code, but also enables the developer or user to focus on the adaptability of the component style in the first processing layer, without the need to spend a lot of cost to study the first logic code in the second processing layer to change the component style, thereby reducing the complexity and difficulty of building an application and improving the development efficiency. On the other hand, the first style access interface is used to realize a unified access mode for the style variable, without the need to pay attention to whether the style variable is exposed, so that the developer or user can also focus on the update of the component style involved in the business theme of the user, thereby reducing the difficulty of modifying the component style and improving the user experience.

[0125] Optionally, in the foregoing Figure 3On the basis of one or more embodiments corresponding to the application, another optional embodiment provided by the embodiments of the application provides that the M topics mentioned include a first topic. The first topic can be understood as any one of the M topics. Wherein, the N first style variables are processed based on the N component style values to obtain N first style performances corresponding to each topic, specifically including:

[0126] For the first topic, the N first style variables are assigned and processed based on the N component style values to obtain the N first style performances corresponding to the first topic.

[0127] For example, Figure 4 An optional schematic diagram of the style performance of the first topic provided by the application is shown. As Figure 4 shown, taking the first topic "space management" as an example, under the first topic, it can include a "space homepage" component, an "authorization information" component, a "cloud service authorization" component, a "member management" component, and a "fee center" component. Taking N=2 as an example, the corresponding components can include the "authorization information" component and the "cloud service authorization" component.

[0128] For the "authorization information" component, assuming that its corresponding component style value is "orange", at this time, the "orange" can be assigned to the first style variable corresponding to the "authorization information" component, such as a color variable, etc. In this way, the first style performance of the "authorization information" component in the "space management" topic can be obtained, that is, the color is displayed as orange.

[0129] Similarly, for the "cloud service authorization" component, assuming that its corresponding component style value is "yellow", at this time, the "yellow" can be assigned to the first style variable corresponding to the "cloud service authorization" component, such as a color variable, etc. In this way, the first style performance of the "cloud service authorization" component in the "space management" topic can be obtained, that is, the color is displayed as yellow.

[0130] It should be noted that for other components in the "space management" topic, their first style performances can be understood with reference to the first style performance of the "authorization information" component and the first style performance of the "cloud service authorization" component. The application will not be described in detail. In addition, for other topics in addition to the first topic, the first style performance of the components can also be understood with reference to the first style performance corresponding to the first topic. The application will not be described in detail.

[0131] Optionally, in the above Figure 3 On the basis of one or more embodiments corresponding to the application, another optional embodiment provided by the embodiments of the application provides that after determining the N first style performances corresponding to the first topic, the N first style performances corresponding to the first topic can also be displayed on the first visual display area.

[0132] It should be noted that the first visual display area described includes but is not limited to: an interface in the component processing device that can have a visual display function; or, it can also be a certain display area in the visual display interface of the component processing device; or, it can also be a client with a visualization function, such as a browser, an editor, etc., which is not specifically limited in the present application.

[0133] For example, as shown in the above Figure 4 For example, as shown in the above

[0134] In the embodiments of the present application, the N first style representations corresponding to the first theme are visually displayed by the above-mentioned manner, and the design intention is conveyed from the vision. On the one hand, the user or the developer can understand the specific style display of the required components in the first theme in a timely manner, so as to quickly understand and evaluate the appearance and style of the components. On the other hand, the user or the developer can visually view the appearance of each component, so as to find and solve potential problems that do not meet the development requirements in advance, and reduce the modification and adjustment work in the later development.

[0135] Optionally, on the basis of one or more embodiments Figure 3 In another optional embodiment provided by the embodiments of the present application based on one or more embodiments, the M themes mentioned also include a second theme. It should be noted that the second theme mentioned in the present application is any one of the M themes, and the second theme is different from the first theme. As an illustrative description, the N first style representations corresponding to the second theme can be determined by one or more of the following ways. Specifically as follows:

[0136] Method one, assignment processing

[0137] In one or more embodiments, for the second theme, the N component style values required by the second theme are assigned to the N first style variables in the second theme to obtain the N first style representations corresponding to the second theme.

[0138] Exemplarily, Figure 5 An optional schematic diagram of the style representation of the second theme provided by the present application is shown. As Figure 5As shown, taking the second theme as an example, under the second theme, the "environment setting" component, the "alarm setting" component, the "global setting" component, the "permission setting" component, and the "resource reuse" component can be included. Taking N = 1 as an example, the corresponding component can include the "environment setting" component.

[0139] For the "environment setting" component, assuming that its corresponding component style value is "greed", at this time, the "greed" can be assigned to the first style variable corresponding to the "environment setting" component, such as a color variable, and in this way, the first style performance of the "environment setting" component in the "setting" theme can be obtained, that is, the color is displayed as green.

[0140] It should be noted that the first style performance of other components in the "setting" theme can also be understood with reference to the first style performance of the "environment setting" component, and the present application will not be repeated.

[0141] Method two, theme inheritance

[0142] In one or more embodiments, for the second theme, the N first style performances corresponding to the first theme are loaded and processed based on the theme inheritance method to obtain the N first style performances corresponding to the second theme.

[0143] In this example, the described theme inheritance method is a commonly used technique in programming and development, which allows developers to use existing themes as a basis and then create new sub-themes to inherit and extend the functions and styles of the parent theme. This method helps to reduce repetitive work, improve development efficiency, and make theme updating and maintenance more convenient.

[0144] Based on this, for the multiple themes involved in the development process of the application program, each theme can be set with the same style performance in many cases to ensure that the pages of the application program remain neat and the elements such as color are unified. Therefore, after determining the N first style performances corresponding to the first theme, the present application can use the theme inheritance method to load and process the N first style performances corresponding to the first theme, so that the second theme can inherit the N first style performances of the first theme, that is, obtain the N first style performances corresponding to the second theme.

[0145] As an illustrative description, the N first style variables in the second theme can be matched with the N first style variables in the first theme. And in the case of matching the first style variables, the first style performance corresponding to the matched first style variable in the first theme is determined as the style performance corresponding to the corresponding first style variable in the second theme.

[0146] For example, Figure 6Another optional schematic diagram showing the style expression of the second subject provided in the present application is shown. The first subject is taken as an example as described above Figure 5 The second subject is taken as an example as shown in the above Figure 6 As shown, under the second subject, the “environment setting” component, the “alarm setting” component, the “global setting” component, the “permission setting” component, and the “resource reuse” component can be included. Taking N=2 as an example, the components required by the second subject include the “environment setting” component and the “alarm setting” component.

[0147] It is assumed that the first style variable corresponding to the “authorization information” component and the “cloud service authorization” component shown in the above Figure 4 is style variable 11 and style variable 12 respectively. Similarly, it is assumed that the first style variable corresponding to the “environment setting” component and the “alarm setting” component shown in the above Figure 6 is style variable 21 and style variable 22 respectively. And it can be known from the above Figure 4 that the first style expression of the “authorization information” component is to display orange in color, and the first style expression of the “cloud service authorization” component is to display yellow in color.

[0148] If the style variable 11 and the style variable 21 match each other, at this time, the first style expression (i.e., displaying orange in color) of the “authorization information” component can be inherited from the first style expression of the “environment setting” component, that is, it can be determined that the first style expression of the “environment setting” component is to display orange in color.

[0149] Similarly, if the style variable 12 and the style variable 22 match each other, at this time, the first style expression (i.e., displaying yellow in color) of the “cloud service authorization” component can be inherited from the first style expression of the “alarm setting” component, that is, it can be determined that the first style expression of the “alarm setting” component is to display yellow in color.

[0150] In the embodiments of the present application, by using the theme inheritance method provided above to load the N first style expressions of the first subject into the second subject, the N first style expressions corresponding to the second subject can be determined without adding and covering attributes. On the one hand, it makes the style development of the component easy, simplifies the development and maintenance process of the style, reduces the workload and improves the development efficiency. On the other hand, by using the theme inheritance method, the style management between the themes is more efficient, flexible and maintainable, allowing the code consistency and reusability to be maintained while quickly customizing and extending the style.

[0151] Optionally, in the above Figure 3On the basis of one or more embodiments corresponding to the present application, in another optional embodiment provided by the present application, after the N first style performances corresponding to the second theme are obtained by executing one or more of the above-mentioned manner one and manner two, the N first style performances corresponding to the second theme can also be displayed on a second visual display area.

[0152] It should be noted that the second visual display area described includes but is not limited to: an interface in the component processing device that can have a visual display function; or, it can also be a certain display area in the visual display interface of the component processing device; or, it can also be a client with a visual function, such as a browser, an editor, etc., which is not limited in the present application.

[0153] In the embodiments of the present application, the N first style performances corresponding to the second theme are visually displayed by the above-mentioned manner, which can enable the user or the developer to timely understand the specific style display of the required components in the second theme, and visually view the appearance of each component, etc., thereby providing a direction for subsequent in-depth analysis and style change.

[0154] In addition, the first visual display area and the second visual display area mentioned in the present application can be deployed on different visual display interfaces. For example, in combination with the above-mentioned Figure 4 and Figure 5 , or in combination with Figure 4 and Figure 6 , it can be seen that the first visual display area and the second visual display area are deployed on different visual display interfaces.

[0155] Alternatively, the first visual display area and the second visual display area mentioned in the present application can also be deployed at different display positions in the same visual display interface. For example, in a certain visual display interface A, the first visual display area and the second visual display area are included. And the first visual display area is deployed at the upper left corner of the visual display interface A, and the second visual display area is deployed at the lower right corner of the visual display interface A.

[0156] The specific positions of the two display areas and the specific display manner thereof are not limited in the present application.

[0157] In the embodiments of the present application, the first visual display area and the second visual display area are displayed on the same visual display interface through the above-mentioned manner. On the one hand, the user or the developer can intuitively view the first style performance corresponding to the first theme and the second style performance corresponding to the second theme on the same interface, which provides a direction for subsequent in-depth analysis and style change. On the other hand, the user or the developer can timely locate the performance difference between the first style performance of the first theme and the second style performance of the second theme, so as to discover and solve potential problems that do not meet the development requirements early, and reduce the modification and adjustment work in the later development stage.

[0158] Optionally, in the above-mentioned Figure 3 Based on one or more embodiments, in another optional embodiment provided by the embodiments of the present application, after the N first style performances corresponding to the first theme are loaded and processed based on the theme inheritance method to obtain the N first style performances corresponding to the second theme, the following operation can be further performed, that is:

[0159] Obtaining a style update request, the style update request including style update information;

[0160] Based on the style update information in the style update request, updating the N first style performances corresponding to the second theme to obtain target style performances corresponding to the second theme.

[0161] In this example, the N first style performances corresponding to the second theme determined by the theme inheritance method inherit the N first style performances corresponding to the first theme as a whole. Or, the N first style performances corresponding to the second theme determined by the theme inheritance method are highly consistent with the N first style performances corresponding to the first theme.

[0162] However, in some scenarios, it is necessary to fine-tune or customize the component styles that meet the second theme. At this time, in order to adapt to the actual design requirements of the second theme, the style update request can be obtained based on the actual design requirements after the N first style performances corresponding to the second theme are determined by using the above-mentioned theme inheritance method. In the style update request, the style update information is included. Through the style update information, it can be understood which component styles in the second theme need to be updated. For example, the updating methods include but are not limited to modifying the component styles of the existing components, deleting the component styles of the existing components, adding new component styles to the existing components, and the like, which are not limited in the present application.

[0163] Thus, upon receiving an update request, the style update information contained in the request is used to update the N first style representations corresponding to the second theme. This update can be performed locally or globally to obtain the target style representation for the second theme. As an illustrative description, the style update information includes the target update value of the target variable, which is any one or more of the N first style variables in the second theme. Updating the N first style representations corresponding to the second theme based on the style update information in the style update request to obtain the target style representation includes adjusting the component style values ​​of the target variables to the corresponding target update values ​​to obtain the target style representation for the second theme.

[0164] For example, Figure 7 This illustration shows another optional schematic of the style representation of the second theme provided in this application. The first style representation of the second theme obtained through the aforementioned theme inheritance method (i.e.) Figure 6 Taking the example shown below, from Figure 6 As can be seen, under this second theme, the first style of the "Environment Settings" component is displayed in orange, and the first style of the "Alarm Settings" component is displayed in yellow.

[0165] Assuming the target variable is style variable 21 (i.e., the style variable corresponding to the "Environment Settings" component), and its target update value is "color displayed as blue," then the component style value (i.e., "orange") corresponding to the "Environment Settings" component needs to be adjusted to "blue," so that the first style appearance of the "Environment Settings" component changes from "color displayed as orange" to "color displayed as blue." Furthermore, for the "Alarm Settings" component in the second theme, since its first style variable is style variable 22, and the style update information only involves style changes to style variable 21, its first style appearance does not need to be changed.

[0166] In this embodiment, the style update described above allows for fine-tuning and expansion of the second theme's style while maintaining most of the style's appearance unchanged, thereby determining a style appearance that better suits the design requirements of the second theme. In other words, this method enables the customization of component styles to meet the needs of different scenarios, providing personalized and flexible style customization for subsequent application development, thus satisfying diverse R&D requirements.

[0167] Optionally, in the above Figure 3On the basis of one or more embodiments corresponding to the application, in another optional embodiment provided by the embodiments of the application, after the component style value of the target variable is adjusted to the target update value corresponding to the target variable to obtain the target style performance corresponding to the second theme, the target style performance corresponding to the second theme can also be displayed on a third visual display area.

[0168] It should be noted that the third visual display area mentioned above can be the same as the second visual display area mentioned above, and details are not described here.

[0169] Optionally, in the above Figure 3 On the basis of one or more embodiments corresponding to the application, in another optional embodiment provided by the embodiments of the application, the following operations can also be performed, that is:

[0170] In the first processing layer, the N first style variables are updated to obtain second style variables. Then, based on the second style variables, the N first style performances corresponding to each theme are updated to obtain second style performances corresponding to each theme. Similarly, based on the second style variables, the N first logic codes are also updated to obtain second logic codes. It should be noted that the update described here can include but is not limited to modification, addition, deletion, etc. of the N first style variables, and the specific embodiments are not limited in the application.

[0171] For example, taking the addition operation as an example, assuming that the original N first style variables are style variable 1 to style variable N, if a new style variable (for example, style variable N+1) is added in the first processing layer, the obtained second style variable is style variable N+1. At this time, the style variable N+1 can be assigned a component style value, thereby completing the update processing of the N first style performances corresponding to each theme, so as to obtain the second style performance of each theme under the second style variable. Similarly, the style variable N+1 is also used to complete the update of the N first logic codes, so that the obtained second logic code can adapt to the new second style performance, and the new second style performance can also reflect the function implemented by the second logic code.

[0172] In this way, by running the second logic code and viewing the second style performance, if the second style performance cannot be correctly displayed when the second logic code is run, the style prompt information is displayed. That is, the style prompt information can be used to prompt that one or more of the second logic code and the second style performance has an update error.

[0173] As an illustrative description, after the display style prompt information is displayed, a processing strategy can be determined based on the style prompt information. In this way, one or more of the second logic code and the second style performance can be processed based on the processing strategy.

[0174] For example, the second logic code is rewritten to adapt to the current second style performance. Alternatively, the correct component style value is assigned to the corresponding second style variable, and the current second style performance is adjusted so that the adjusted second style performance can correctly adapt to the corresponding component logic code.

[0175] In the embodiments of the present application, the updated second logic code and the second style performance are associated in the same second style variable by the above-mentioned manner. On the one hand, it can ensure complete synchronization between the component logic layer and the theme layer, thereby improving the maintainability and readability of the code; on the other hand, it can also help better manage and component logic code, thereby improving development efficiency. In addition, the display of the style prompt information prompts the error of the logic code and the style performance, and the problem is found in time, and the processing strategy can solve and modify the inconsistency between the backend code and the front-end display, thereby improving the quality of the code.

[0176] The above mainly introduces the scheme provided by the embodiments of the present application from the method aspect. It can be understood that in order to realize the above-mentioned functions, the corresponding hardware structure and / or software module for executing each function is included. Those skilled in the art should easily realize that the modules and algorithm steps of each example described in combination with the embodiments disclosed in the present application can be realized in the form of hardware or a combination of hardware and computer software. Whether a certain function is executed in the form of hardware or computer software driven hardware depends on the specific application and design constraints of the technical solution. Professional technicians can use different methods to realize the described functions for each specific application, but such implementation should not be considered beyond the scope of the present application.

[0177] The component processing device in the present application will be described in detail below. Please refer to Figure 8 , Figure 8 An embodiment of the component processing device in the present application is shown in the figure. The component processing device comprises:

[0178] The acquisition module 801 is configured to acquire a first request. The first request comprises N first style access interfaces and M component style values required by M themes respectively, and there is a one-to-one mapping relationship between the N first style access interfaces and N first style variables. Each component style value is used to represent the value of a first style variable, and each first style variable is used to represent the style performance of the corresponding component. N and M are integers greater than or equal to 1.

[0179] The calling module 802 is configured to call N first style variables based on the N first style access interfaces in the first processing layer;

[0180] The processing module 803 is configured to process the N first style variables based on the N component style values for each theme, to obtain N first style performances corresponding to each theme.

[0181] The calling module 802 is configured to call N first logic codes based on the N first style variables in the second processing layer, the N first logic codes being used to indicate code logic of the N first style performances, the first processing layer and the second processing layer being two different processing layers.

[0182] The generating module 804 is configured to fuse the N first style performances with N first logic codes required by each theme respectively, to generate N target components required by each theme, the N target components being used to generate an application corresponding to the theme.

[0183] Optionally, in the above Figure 8 based on the corresponding embodiments, another embodiment of the component processing apparatus provided by the present embodiment is provided,

[0184] The obtaining module 801 is specifically configured to: before calling the N first style variables based on the N first style access interfaces in the first processing layer, obtain a plurality of candidate components, and extract component style variables of each candidate component and logic codes of each candidate component.

[0185] The processing module 803 is specifically configured to:

[0186] save the component style variables of each candidate component in the first processing layer, and save the logic codes of each candidate component in the second processing layer.

[0187] In the first processing layer, the component style variables of each candidate component are subjected to interface abstraction processing, to obtain a second style access interface corresponding to each component style variable.

[0188] When the first style access interface matches the second style access interface, the component style variable corresponding to the matched second style access interface is determined as the first style variable corresponding to the first style access interface.

[0189] Optionally, in the above Figure 8 based on one or more of the embodiments, another embodiment of the component processing apparatus provided by the present embodiment is provided, the M themes include a first theme, and the first theme is any one of the M themes.

[0190] The processing module 803 is specifically configured to: for the first theme, perform assignment processing on N component style values and N first style variables to obtain N first style performances corresponding to the first theme.

[0191] Optionally, based on the one or more embodiments described above Figure 8 Based on the one or more embodiments described above, in another embodiment of the component processing apparatus provided by the present embodiment, the processing module 803 is specifically further configured to:

[0192] After the assignment processing on the N component style values and the N first style variables for the first theme to obtain the N first style performances corresponding to the first theme, the N first style performances corresponding to the first theme are displayed on the first visual display area.

[0193] Optionally, based on the one or more embodiments described above Figure 8 Based on the one or more embodiments described above, in another embodiment of the component processing apparatus provided by the present embodiment, the M themes further include a second theme, and the first theme is different from the second theme.

[0194] The processing module 803 is specifically further configured to: for the second theme, perform loading processing on the N first style performances corresponding to the first theme based on a theme inheritance method to obtain N first style performances corresponding to the second theme.

[0195] Optionally, based on the one or more embodiments described above Figure 8 Based on the one or more embodiments described above, in another embodiment of the component processing apparatus provided by the present embodiment, the processing module 803 is specifically further configured to:

[0196] After the loading processing on the N first style performances corresponding to the first theme based on the theme inheritance method for the second theme to obtain the N first style performances corresponding to the second theme, the N first style performances corresponding to the second theme are displayed on the second visual display area.

[0197] Optionally, based on the one or more embodiments described above Figure 8 Based on the one or more embodiments described above, in another embodiment of the component processing apparatus provided by the present embodiment, the obtaining module 801 is specifically further configured to: after the loading processing on the N first style performances corresponding to the first theme based on the theme inheritance method to obtain the N first style performances corresponding to the second theme, obtain a style update request, and the style update request includes style update information.

[0198] The processing module 803 is specifically further configured to: based on the style update information in the style update request, perform update processing on the N first style performances corresponding to the second theme to obtain target style performances corresponding to the second theme.

[0199] Optionally, based on the one or more embodiments described aboveFigure 8 According to one or more embodiments, in another embodiment of the component processing apparatus provided by the present application, the style update information includes a target update value of a target variable, the target variable being any one or more of the N first style variables in the second theme; the processing module 803 is specifically configured to:

[0200] adjust the component style value of the target variable to the target update value of the corresponding target variable;

[0201] perform assignment processing on the target variable based on the target update value of the target variable to obtain the target style performance corresponding to the second theme.

[0202] Optionally, in the above Figure 8 According to one or more embodiments, in another embodiment of the component processing apparatus provided by the present application, the processing module 803 is specifically further configured to:

[0203] after performing assignment processing on the target variable based on the target update value of the target variable to obtain the target style performance corresponding to the second theme, display the target style performance corresponding to the second theme on the third visual display area.

[0204] Optionally, in the above Figure 8 According to one or more embodiments, in another embodiment of the component processing apparatus provided by the present application, the processing module 803 is specifically further configured to:

[0205] update the N first style variables in the first processing layer to obtain second style variables;

[0206] based on the second style variables, update the N first style performances corresponding to each theme to obtain second style performances corresponding to each theme;

[0207] based on the second style variables, update the N first logic codes to obtain second logic codes;

[0208] if the second style performance cannot be correctly displayed when the second logic code is run, display style prompt information, the style prompt information being used to prompt that one or more of the second logic code and the second style performance has an update error.

[0209] Optionally, in the above Figure 8 According to one or more embodiments, in another embodiment of the component processing apparatus provided by the present application, the processing module 803 is specifically further configured to:

[0210] after displaying the style prompt information, determine a processing strategy based on the style prompt information;

[0211] Based on the processing strategy, one or more of the second logical code and the second style representation are processed.

[0212] Optionally, in the above Figure 8 Based on one or more embodiments corresponding to the above, another embodiment of the component processing apparatus provided by the embodiments of the present application includes one or more of the specific style variables and the general style variables.

[0213] The above describes the component processing apparatus in the embodiments of the present application from the perspective of modular functional entities. The following describes the component processing device in the embodiments of the present application from the perspective of hardware processing. Figure 9 An optional schematic diagram of the hardware structure of the component processing device provided by the embodiments of the present application is shown. The component processing device can have great differences due to different configurations or performances, for example, but not limited to Figure 8 the component processing apparatus shown in the above

[0214] As shown in the above Figure 9 The component processing device 300 can have great differences due to different configurations or performances, and can include one or more central processing units (CPUs) 322 (for example, one or more processors) and a memory 332, one or more storage media 330 (for example, one or more mass storage devices) for storing applications 342 or data 344. The memory 332 and the storage media 330 can be temporary storage or persistent storage. The programs stored in the storage media 330 can include one or more modules (not shown in the figure), and each module can include a series of instruction operations in the component processing device. Further, the central processing unit 322 can be configured to communicate with the storage media 330 and execute the series of instruction operations in the storage media 330 on the component processing device 300. For example, the central processing unit 322 is configured to execute the applications 342 stored in the storage media 330, thereby implementing the component processing method provided by the above embodiments of the present application.

[0215] The component processing device 300 can further include one or more power supplies 326, one or more wired or wireless network interfaces 350, one or more input / output interfaces 358, and / or one or more operating systems 341, such as Windows ServerTM, Mac OS XTM, UnixTM, LinuxTM, FreeBSDTM, and the like.

[0216] For example, Figure 9 The central processing unit 322 in the above may execute the computer execution instructions stored in the memory 332, so that the component processing device performs the component processing method asFigure 3 The method in the corresponding method embodiment.

[0217] Specifically, Figure 8 The functions / implementation processes of the processing module 803, calling module 802, and generating module 804 can be achieved through... Figure 9 The central processing unit 322 in the memory calls computer execution instructions stored in the memory 332 to achieve this. Figure 8 The function / implementation process of the acquisition module 801 can be obtained through Figure 8 It is implemented using the input / output interface 358.

[0218] The steps performed by the component processing device in the above embodiments can be based on this Figure 9 The component processing equipment structure is shown.

[0219] This application also provides a computer-readable storage medium storing a computer program or instructions thereon, which, when executed by a processor, implements the steps of the methods described in the foregoing embodiments.

[0220] This application also provides a computer program product, including a computer program or instructions, which, when executed by a processor, implement the steps of the methods described in the foregoing embodiments.

[0221] In the above embodiments, implementation can be achieved, in whole or in part, through software, hardware, firmware, or any combination thereof. When implemented in software, it can be implemented, in whole or in part, as a computer program product.

[0222] Those skilled in the art will clearly understand that, for the sake of convenience and brevity, the specific working processes of the systems, devices, and units described above can be referred to the corresponding processes in the foregoing method embodiments, and will not be repeated here.

[0223] In the several embodiments provided in this application, it should be understood that the disclosed systems, apparatuses, and methods can be implemented in other ways. For example, the apparatus embodiments described above are merely illustrative; for instance, the division of units is only a logical functional division, and in actual implementation, there may be other division methods. For example, multiple units or components may be combined or integrated into another system, or some features may be ignored or not executed. Furthermore, the coupling or direct coupling or communication connection shown or discussed may be an indirect coupling or communication connection between apparatuses or units through some interfaces, and may be electrical, mechanical, or other forms.

[0224] The units described as separate components may or may not be physically separate, and the components displayed as units may or may not be physical units, i.e. may be located in one place, or may be distributed on multiple network units. Part or all of the units can be selected to achieve the purpose of the embodiment scheme according to actual needs. In addition, the functional units in each embodiment of the present application can be integrated in one processing unit, or each unit can be physically present alone, or two or more units can be integrated in one unit. The integrated unit can be realized in the form of hardware or in the form of software functional unit.

[0225] The integrated unit, if realized in the form of software functional unit and sold or used as an independent product, can be stored in a computer readable storage medium. Based on such understanding, the technical solutions of the present application essentially or the part of the prior art that contributes to the technical solutions or the whole or part of the technical solutions can be embodied in the form of software product, which is stored in a storage medium and includes a plurality of instructions for making a computer device (which can be a server or a terminal device, etc.) execute all or part of the steps of the method described in each embodiment of the present application. The foregoing storage medium includes: U disk, mobile hard disk, read-only memory (ROM), random access memory (RAM), magnetic disk or optical disk and various computer program storage media.

[0226] The above embodiments are only used to illustrate the technical solutions of the present application, but not to limit them; although the present application has been described in detail with reference to the foregoing embodiments, those skilled in the art should understand that the technical solutions recorded in the foregoing embodiments can be modified, or some technical features can be replaced by equivalent ones; and these modifications or replacements do not make the corresponding technical solutions deviate from the spirit and scope of the technical solutions of the embodiments of the present application.

Claims

1. A method of assembly processing, characterized by, The method for processing the component comprises: obtaining a first request, the first request comprising N first style access interfaces and M theme-required N component style values, the N first style access interfaces being in one-to-one mapping relationship with N first style variables, each of the component style values being used for representing a value of a first style variable, each of the first style variables being used for representing a style performance of a corresponding component, N and M being integers greater than or equal to 1; calling the N first style variables in a first processing layer based on the N first style access interfaces; processing the N first style variables based on the N component style values for each of the themes to obtain N first style performances corresponding to each of the themes; calling N first logic codes in a second processing layer based on the N first style variables, the N first logic codes being used for indicating code logic of the N first style performances, the first processing layer and the second processing layer being two different processing layers; fusing the N first style performances with the N first logic codes required by each of the themes to generate N target components required by each of the themes, the N target components being used for generating an application program corresponding to the themes.

2. The method of claim 1, wherein, Before the calling of the N first style variables in the first processing layer based on the N first style access interfaces, the method further comprises: obtaining a plurality of candidate components and extracting component style variables of each of the candidate components and logic codes of each of the candidate components; saving the component style variables of each of the candidate components in the first processing layer and saving the logic codes of each of the candidate components in the second processing layer; performing interface abstraction processing on the component style variables of each of the candidate components in the first processing layer to obtain second style access interfaces corresponding to each of the component style variables; the calling of the N first style variables in the first processing layer based on the N first style access interfaces comprises: when the first style access interfaces are matched with the second style access interfaces, determining the component style variables corresponding to the matched second style access interfaces as the first style variables corresponding to the first style access interfaces.

3. The method of any one of claims 1-2, wherein, The M themes comprise a first theme, the first theme being any one of the M themes; the processing of the N first style variables based on the N component style values for each of the themes to obtain N first style performances corresponding to each of the themes comprises: for the first theme, performing assignment processing on the N component style values to the N first style variables to obtain N first style performances corresponding to the first theme.

4. The method of claim 3, wherein, After the assignment processing of the N component style values to the N first style variables for the first theme to obtain N first style performances corresponding to the first theme, the method further comprises: displaying the N first style performances corresponding to the first theme on a first visual display area.

5. The method of any one of claims 3-4, wherein, The M themes further include a second theme, the first theme being different from the second theme; the method further includes: For the second theme, based on a theme inheritance method, the N first style performances corresponding to the first theme are loaded and processed to obtain N first style performances corresponding to the second theme.

6. The method of claim 5, wherein, After the N first style performances corresponding to the second theme are obtained by loading and processing the N first style performances corresponding to the first theme based on the theme inheritance method for the second theme, the method further includes: Displaying the N first style performances corresponding to the second theme on a second visual display area.

7. The method of any one of claims 5-6, wherein, After the N first style performances corresponding to the second theme are obtained by loading and processing the N first style performances corresponding to the first theme based on the theme inheritance method, the method further includes: Obtaining a style update request, the style update request including style update information; Based on the style update information in the style update request, updating the N first style performances corresponding to the second theme to obtain target style performances corresponding to the second theme.

8. The method of claim 7, wherein, The style update information includes a target update value of a target variable, the target variable being any one or more of the N first style variables in the second theme; Based on the style update information in the style update request, updating the N first style performances corresponding to the second theme to obtain target style performances corresponding to the second theme includes: Adjusting a component style value of the target variable to the target update value corresponding to the target variable; Based on the target update value of the target variable, performing value assignment processing on the target variable to obtain target style performances corresponding to the second theme.

9. The method of claim 8, wherein, After the target style performances corresponding to the second theme are obtained by performing value assignment processing on the target variable based on the target update value of the target variable, the method further includes: Displaying the target style performances corresponding to the second theme on a third visual display area.

10. The method according to any one of claims 1 to 9, characterized in that, The method further includes: Updating the N first style variables in the first processing layer to obtain second style variables; Based on the second style variables, updating the N first style performances corresponding to each theme to obtain second style performances corresponding to each theme; Based on the second style variables, updating the N first logic codes to obtain second logic codes; If the second style performances are not correctly displayed when the second logic codes are run, displaying style prompt information, the style prompt information being used to prompt one or more of the second logic codes and the second style performances to have update errors.

11. The method of claim 10, wherein, After the style prompt information is displayed, the method further includes: Determining a processing strategy based on the style prompt information; Based on the processing strategy, processing one or more of the second logic codes and the second style performances.

12. The method according to any one of claims 1 to 11, characterized in that, The first style variables include one or more of specific style variables and general style variables.

13. An assembly processing apparatus, characterized by Including: An acquisition module is configured to acquire a first request, the first request comprising N first style access interfaces and M theme-required N component style values, the N first style access interfaces having a one-to-one mapping relationship with N first style variables, each of the component style values representing a value of a first style variable, each of the first style variables representing a style performance of a corresponding component, N and M being integers greater than or equal to 1; A calling module is configured to call the N first style variables based on the N first style access interfaces at a first processing layer; A processing module is configured to, for each of the themes, process the N first style variables based on the N component style values, and obtain N first style performances corresponding to each of the themes; The calling module is configured to call N first logic codes based on the N first style variables at a second processing layer, the N first logic codes being used to indicate code logic of the N first style performances, the first processing layer and the second processing layer being two different processing layers; A generation module is configured to, for each of the themes, fuse the N first style performances with the N first logic codes required by each of the themes, to generate N target components required by each of the themes, the N target components being used to generate an application corresponding to the theme.

14. An assembly processing apparatus comprising a memory and a processor, the memory storing a computer program, characterized in that, The processor executes the computer program to implement the steps of the component processing method in any one of claims 1 to 12.

15. A computer readable storage medium having stored thereon a computer program, characterized in that, The computer program is executed by the processor to implement the steps of the component processing method in any one of claims 1 to 12.

16. A computer program product comprising a computer program, characterized in that, The computer program is executed by the processor to implement the steps of the component processing method in any one of claims 1 to 12.