CN112540755A - Front-end-based component processing method, device, equipment and storage medium - Google Patents

Front-end-based component processing method, device, equipment and storage medium Download PDF

Info

Publication number
CN112540755A
CN112540755A CN202011542922.7A CN202011542922A CN112540755A CN 112540755 A CN112540755 A CN 112540755A CN 202011542922 A CN202011542922 A CN 202011542922A CN 112540755 A CN112540755 A CN 112540755A
Authority
CN
China
Prior art keywords
component
processed
template
click event
current
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN202011542922.7A
Other languages
Chinese (zh)
Inventor
黄康
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Ping An Puhui Enterprise Management Co Ltd
Original Assignee
Ping An Puhui Enterprise Management Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Ping An Puhui Enterprise Management Co Ltd filed Critical Ping An Puhui Enterprise Management Co Ltd
Priority to CN202011542922.7A priority Critical patent/CN112540755A/en
Publication of CN112540755A publication Critical patent/CN112540755A/en
Pending legal-status Critical Current

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/30—Creation or generation of source code
    • G06F8/36—Software reuse
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/166—Editing, e.g. inserting or deleting
    • G06F40/186—Templates
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00—Arrangements for program control, e.g. control units
    • G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44—Arrangements for executing specific programs
    • G06F9/445—Program loading or initiating
    • G06F9/44505—Configuring for program initiating, e.g. using registry, configuration files

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Health & Medical Sciences (AREA)
  • Artificial Intelligence (AREA)
  • Audiology, Speech & Language Pathology (AREA)
  • Computational Linguistics (AREA)
  • General Health & Medical Sciences (AREA)
  • Stored Programmes (AREA)

Abstract

The embodiment of the invention relates to the field of big data, and discloses a front-end-based component processing method, a device, equipment and a storage medium, wherein the method comprises the following steps: adding a code for detecting the running environment of the front end, and detecting the current running environment of the front end according to the code; when detecting that the current operation environment of the front end meets the operation condition, acquiring a component to be processed in the current project of the front end, and determining a component template of the component to be processed; analyzing the component template of the component to be processed, extracting the template part of the component to be processed to the new component, and extracting the style part of the component to be processed to the new component; and determining the click event of the component to be processed as the click event of the new component, and deleting the component to be processed in the current project so as to realize the automatic conversion of the component, reduce the complexity and improve the performance and the processing efficiency of the component. The present invention relates to blockchain techniques, such as component data can be written into blockchains for scenarios such as data forensics.

Description

Front-end-based component processing method, device, equipment and storage medium
Technical Field
The present invention relates to the field of computer technologies, and in particular, to a front-end-based component processing method, apparatus, device, and storage medium.
Background
In the front-end field, componentization writing is a development trend all the time, and at present, componentization is supported by various large browsers through the native Web Components API specification. However, in the current market, the common front-end frameworks such as read, Vue, and regular, etc. do not support the componentized writing method through the native Web Components API specification, but through the self-built component writing method and compiling system, and the main reason is that when the native Web Components API specification is just released, the support degree of each large browser manufacturer is low, so that the componentization can only be realized by the framework itself, and the size of the resource package is increased. Most browsers today already support the Web Components API natively, and for pure native projects, direct reuse cannot be achieved, and developers are required to develop the API again.
Disclosure of Invention
The embodiment of the invention provides a front-end-based component processing method, device, equipment and storage medium, which can realize automatic conversion of components, reduce complexity and improve the performance and processing efficiency of the components.
In a first aspect, an embodiment of the present invention provides a front-end-based component processing method, where the method includes:
adding a code for detecting the running environment of the front end, and detecting the current running environment of the front end according to the code;
when detecting that the current operating environment of the front end meets the operating conditions, acquiring a component to be processed in the current project of the front end, and determining a component template of the component to be processed according to the component to be processed;
analyzing the component template of the component to be processed, extracting the template part of the component to be processed to a new component, and extracting the style part of the component to be processed to the new component;
and acquiring the click event of the component to be processed, determining the click event of the component to be processed as the click event of the new component, and deleting the component to be processed in the current project.
Further, when it is detected that the current operating environment of the front end meets the operating condition, acquiring the component to be processed in the current project of the front end includes:
when detecting that the current operation environment of the front end meets the operation condition, acquiring a configuration file in a root directory of a current item of the front end;
and acquiring address information in the configuration file, and acquiring the components to be processed in the current project of the front end according to the address information.
Further, the determining the component template of the component to be processed according to the component to be processed includes:
acquiring the component name of the component to be processed in the current project of the front end, and generating a corresponding file to be processed according to the component name;
and determining the component template of the component to be processed according to the generated file to be processed.
Further, the analyzing the component template of the component to be processed and extracting the template part of the component to be processed to a new component includes:
analyzing the component to be processed according to the first keyword, and determining template content corresponding to the first keyword;
and determining a new component corresponding to the component to be processed according to the template content and the file to be processed, and extracting the template part of the component to be processed to the new component.
Further, the extracting the style part of the component to be processed to the new component includes:
analyzing the template of the component to be processed according to a preset pattern keyword, and determining an inline pattern file corresponding to the preset pattern keyword in the template;
analyzing the component to be processed according to a second keyword, and determining a style file corresponding to the second keyword from the component to be processed;
and combining the determined inline style file and the style file to obtain a target style file, and adding the content of the target style file into the new component.
Further, the obtaining the click event of the component to be processed and determining that the click event of the component to be processed is the click event of the new component includes:
searching a click event corresponding to a preset click event keyword from the component to be processed according to the preset click event keyword, and acquiring a method function corresponding to the click event;
and adding the click event to the new component according to the method function corresponding to the obtained click event.
Further, before detecting the current operating environment of the front end according to the code, the method further includes:
determining a root directory of the current project according to the current project of the front end, and writing a configuration file in the determined root directory of the current project;
and configuring the address information of the component to be converted in the configuration file.
In a second aspect, an embodiment of the present invention provides a front-end-based component processing apparatus, including:
the detection unit is used for adding a code for detecting the running environment of the front end and detecting the current running environment of the front end according to the code;
the acquisition unit is used for acquiring a component to be processed in the current project of the front end when the current operation environment of the front end is detected to meet the operation condition, and determining a component template of the component to be processed according to the component to be processed;
an extraction unit for analyzing the component template of the component to be processed, extracting the template part of the component to be processed to a new component, and extracting the style part of the component to be processed to the new component;
and the determining unit is used for acquiring the click event of the component to be processed, determining the click event of the component to be processed as the click event of the new component, and deleting the component to be processed in the current item.
In a third aspect, an embodiment of the present invention provides a computer device, including a processor, an input device, an output device, and a memory, where the processor, the input device, the output device, and the memory are connected to each other, where the memory is used to store a computer program that supports a front-end-based component processing apparatus to execute the foregoing method, and the computer program includes a program, and the processor is configured to call the program to execute the foregoing method according to the first aspect.
In a fourth aspect, the present invention provides a computer-readable storage medium, which stores a computer program, where the computer program is executed by a processor to implement the method of the first aspect.
The embodiment of the invention can add a code for detecting the running environment of the front end and detect the current running environment of the front end according to the code; when detecting that the current operating environment of the front end meets the operating conditions, acquiring a component to be processed in the current project of the front end, and determining a component template of the component to be processed according to the component to be processed; analyzing the component template of the component to be processed, extracting the template part of the component to be processed to a new component, and extracting the style part of the component to be processed to the new component; and acquiring the click event of the component to be processed, determining the click event of the component to be processed as the click event of the new component, and deleting the component to be processed in the current project. By the implementation mode, automatic conversion of the components can be realized, the complexity is reduced, and the performance and the processing efficiency of the components are improved.
Drawings
In order to more clearly illustrate the technical solutions of the embodiments of the present invention, the drawings needed to be used in the description of the embodiments are briefly introduced below, and it is obvious that the drawings in the following description are some embodiments of the present invention, and it is obvious for those skilled in the art to obtain other drawings based on these drawings without creative efforts.
FIG. 1 is a schematic flow chart diagram of a front-end based component processing method according to an embodiment of the present invention;
FIG. 2 is a schematic block diagram of a front-end based component processing apparatus according to an embodiment of the present invention;
fig. 3 is a schematic block diagram of a computer device provided by an embodiment of the present invention.
Detailed Description
The technical solutions in the embodiments of the present invention will be clearly and completely described below with reference to the drawings in the embodiments of the present invention, and it is obvious that the described embodiments are some, not all, embodiments of the present invention. All other embodiments, which can be derived by a person skilled in the art from the embodiments given herein without making any creative effort, shall fall within the protection scope of the present invention.
The front-end-based component processing method provided by the embodiment of the invention can be applied to a front-end-based component processing device, and in some embodiments, the front-end-based component processing device is arranged in computer equipment. In certain embodiments, the computer device includes, but is not limited to, one or more of a smartphone, tablet, laptop, and the like.
The front-end-based component processing method provided by the embodiment of the invention is schematically described below with reference to fig. 1.
Referring to fig. 1, fig. 1 is a schematic flow chart of a front-end-based component processing method according to an embodiment of the present invention, and as shown in fig. 1, the method may be executed by a front-end-based component processing apparatus, where the front-end-based component processing apparatus is disposed in a computer device. Specifically, the method of the embodiment of the present invention includes the following steps.
S101: adding a code for detecting the running environment of the front end, and detecting the current running environment of the front end according to the code.
In the embodiment of the present invention, a front-end-based component processing apparatus may add a code for detecting an operating environment of the front end, and detect a current operating environment of the front end according to the code.
In one embodiment, when detecting the current operating environment of the front end according to the code, the front-end-based component processing apparatus may detect whether a browser in the current operating environment of the front end matches a browser of a preset version according to the code, and if the detection result is that the browser in the current operating environment of the front end matches the browser of the preset version, determine that the current operating environment of the front end satisfies an operating condition; and if the detection result is that the browser in the current running environment of the front end is not matched with the browser of the preset version, determining that the current running environment of the front end does not meet the running condition.
In one embodiment, if it is detected that the browser in the current operating environment of the front end does not match the browser of the preset version, prompt information may be generated and output, where the prompt information is used to prompt a user to upgrade or update the browser. In this way, when it is determined that the current operating environment of the front end does not satisfy the operating condition, the user is notified of the processing in time, so that the current operating environment after the processing by the user satisfies the operating condition.
In one embodiment, a front-end based component processing apparatus may determine a root directory of a current project of the front-end according to the current project and write a configuration file in the determined root directory of the current project, before detecting a current operating environment of the front-end according to the code; and configuring the address information of the component to be converted in the configuration file.
In one embodiment, when determining a root directory of the current item according to the current item of the front end, the current item in the front end may be obtained; and determining a root directory in the current item according to the current item in the front end.
In an embodiment, when determining the root directory in the current item according to the current item in the front end, the root directory of the current item may be specifically located in a command line (where the mac system is a terminal), and a command, such as npm pa-exact-component-to-webcam-component-D, is executed.
In one embodiment, the configuration content configuring the address information of the component to be converted in the configuration file is the address of the component to be processed which needs to be converted into the Web Components API syntax. In some embodiments, the configuration file may be a config.
S102: when the fact that the current operation environment of the front end meets the operation conditions is detected, the components to be processed in the current project of the front end are obtained, and the component templates of the components to be processed are determined according to the components to be processed.
In the embodiment of the present invention, when detecting that the current operating environment of the front end satisfies the operating condition, the front-end-based component processing apparatus may acquire a component to be processed in the current project of the front end, and determine a component template of the component to be processed according to the component to be processed. In certain embodiments, the pending components may include, but are not limited to, a acts component, an vue component, and the like.
In one embodiment, when the front-end-based component processing apparatus obtains a component to be processed in a current project of the front end when detecting that a current operating environment of the front end satisfies an operating condition, the front-end-based component processing apparatus may obtain a configuration file in a root directory of the current project of the front end when detecting that the current operating environment of the front end satisfies the operating condition; and acquiring address information in the configuration file, and acquiring the components to be processed in the current project of the front end according to the address information.
In an embodiment, when it is detected that the current operating environment of the front end meets the operating condition, if the component to be processed is a transact component, the front-end-based component processing apparatus may obtain a configuration file config.
In one embodiment, when it is detected that the current operating environment of the front end meets the operating condition, if the component to be processed is an vue component, the front-end-based component processing apparatus may obtain a configuration file config.
In one embodiment, when determining the component template of the component to be processed according to the component to be processed, the front-end-based component processing apparatus may obtain a component name of the component to be processed in a current project of the front end, and generate a corresponding file to be processed according to the component name; and determining the component template of the component to be processed according to the generated file to be processed.
In an embodiment, when the to-be-processed component is a exact component, a to-be-processed file, such as a js file, may be generated according to the exact component name, and a component template of the exact component may be determined according to the generated to-be-processed file.
In some embodiments, the content of the component template of the exact component may include defining a component by class syntax, where the class name is a component name, such as: class component name extensions HTMLelement. In some embodiments, the contents of the component template of the exact component may include a constructor method that defines the component for use in later steps. In some embodiments, the contents of the component template of the exact component may include the native Web Components API syntax, custom elements.
In one embodiment, when the front-end-based component processing apparatus analyzes the component template of the component to be processed and extracts the template portion of the component to be processed to a new component, the front-end-based component processing apparatus may analyze the component to be processed according to a first keyword to determine a template content corresponding to the first keyword; and determining a new component corresponding to the component to be processed according to the template content and the file to be processed, and extracting the template part of the component to be processed to the new component.
In one embodiment, when the component to be processed is a reac component, the JSX grammar of return in the return method can be found in the reac component through the first keyword return, and the template content of the JSX grammar writing method is analyzed to extract the template part of the reac component to the new component. In another embodiment, when the component to be processed is an vue component, the JSX syntax for return in the return method can be found in the vue component by the first keyword return, and the template content of the JSX syntax notation is parsed to extract the template portion of the vue component to the new component.
In one embodiment, when the component to be processed is a reac component, the template portion of the reac component may be extracted to a new component upon extracting the template portion of the component to be processed to the new component. When the template part of the exact component is extracted to the new component, a tag can be newly added in the generated file to be processed, and an identifier with the same name as the component name is newly added on the tag.
In one embodiment, when extracting the template portion of the exact component into a new component, the nested component may be transformed if the exact component also contains nests of other components.
In one example, when extracting the template portion of the exact component to the new component, the defined component may be obtained in the constractor method by syntax let template.
In one embodiment, when the component to be processed is an vue component, the template portion of the vue component may be extracted to the new component when the template portion of the component to be processed is extracted to the new component. When the template part of the component is extracted vue to be a new component, a tag may be added to the generated pending file, and an identifier having the same name as the name of the component may be added to the tag.
S103: analyzing the component template of the component to be processed, extracting the template part of the component to be processed to a new component, and extracting the style part of the component to be processed to the new component.
In the embodiment of the invention, the front-end-based component processing device can analyze the component template of the component to be processed, extract the template part of the component to be processed to a new component, and extract the style part of the component to be processed to the new component.
In one embodiment, when the front-end-based component processing apparatus analyzes the component template of the component to be processed and extracts the template portion of the component to be processed to a new component, the front-end-based component processing apparatus may analyze the component to be processed according to a first keyword to determine a template content corresponding to the first keyword; and determining a new component corresponding to the component to be processed according to the template content and the file to be processed, and extracting the template part of the component to be processed to the new component.
In one embodiment, when the front-end-based component processing apparatus extracts the style part of the component to be processed to the new component, the front-end-based component processing apparatus may analyze a template of the component to be processed according to a preset style keyword, and determine an inline style file corresponding to the preset style keyword in the template; analyzing the component to be processed according to a second keyword, and determining a style file corresponding to the second keyword from the component to be processed; and combining the determined inline style file and the style file to obtain a target style file, and adding the content of the target style file into the new component.
In one embodiment, when the style part of the exact component is extracted to the new component, the inline style file written in the template can be searched and extracted through the preset style key words. In another embodiment, when extracting vue the style part of the component to the new component, the inline style file written in the template can be found and extracted by the preset style key.
In one embodiment, when extracting the style part of the exact component to the new component, the style file can be searched by the second keyword, wherein the style file can be a file ending in cs and extracted. In another embodiment, when the style part of the component is extracted vue to the new component, the style file may be looked up by the second keyword, where the style file may be a file ending in.css and extracted.
In an embodiment, when the style part of the act component is extracted to the new component, the inline style file found in the template and the style file found in the act component may be merged to obtain the target style file.
In one embodiment, when the contents of the target style file are added to the new component, the contents of the target style file may be added to the new component through an appndchild method.
S104: and acquiring the click event of the component to be processed, determining the click event of the component to be processed as the click event of the new component, and deleting the component to be processed in the current project.
In the embodiment of the present invention, a front-end-based component processing apparatus may obtain a click event of the component to be processed, determine that the click event of the component to be processed is a click event of the new component, and delete the component to be processed in the current item.
In one embodiment, when the front-end-based component processing device acquires the click event of the component to be processed and determines that the click event of the component to be processed is the click event of the new component, the front-end-based component processing device may search for a click event corresponding to a preset click event keyword from the component to be processed according to the preset click event keyword and acquire a method function corresponding to the click event; and adding the click event to the new component according to the method function corresponding to the obtained click event.
In one embodiment, when the method function corresponding to the click event is obtained, the click event onClick may be searched through a preset click event keyword, the function name corresponding to the click event is found, and the method function corresponding to the click event is obtained according to the function name. In other embodiments, the method function of the click event may also be obtained in other manners, which is not limited herein.
Therefore, the method can directly execute codes without depending on any framework library, and for developers, the original component logic does not need to be combed again, the Components are not required to be developed aiming at the native Web Components API grammar, and the multiplexing can be realized after the direct conversion, so that the workload of the developers is greatly reduced, the development efficiency is improved, and the development cost, the grammar learning cost and the logic re-combing cost brought in the component re-development process are greatly reduced. The problem that the problem positioning time is wasted due to code error reporting caused by wrongly writing grammar sentences in the manual code writing process is avoided. The performance is better and the complexity is lower after the component is converted.
In the embodiment of the invention, a front-end-based component processing device can add a code for detecting the running environment of the front end and detect the current running environment of the front end according to the code; when detecting that the current operating environment of the front end meets the operating conditions, acquiring a component to be processed in the current project of the front end, and determining a component template of the component to be processed according to the component to be processed; analyzing the component template of the component to be processed, extracting the template part of the component to be processed to a new component, and extracting the style part of the component to be processed to the new component; and acquiring the click event of the component to be processed, determining the click event of the component to be processed as the click event of the new component, and deleting the component to be processed in the current project. By the implementation mode, automatic conversion of the components can be realized, the complexity is reduced, and the performance and the processing efficiency of the components are improved.
The embodiment of the invention also provides a front-end-based component processing device, which is used for executing the unit of the method in any one of the preceding claims. Specifically, referring to fig. 2, fig. 2 is a schematic block diagram of a front-end based component processing apparatus according to an embodiment of the present invention. The front-end-based component processing apparatus of the present embodiment includes: a detection unit 201, an acquisition unit 202, an extraction unit 203, and a determination unit 204.
A detecting unit 201, configured to add a code for detecting an operating environment of the front end, and detect a current operating environment of the front end according to the code;
an obtaining unit 202, configured to obtain a component to be processed in a current project of the front end when it is detected that a current operating environment of the front end meets an operating condition, and determine a component template of the component to be processed according to the component to be processed;
an extracting unit 203, configured to analyze the component template of the component to be processed, extract the template portion of the component to be processed to a new component, and extract the style portion of the component to be processed to the new component;
a determining unit 204, configured to obtain a click event of the component to be processed, determine that the click event of the component to be processed is a click event of the new component, and delete the component to be processed in the current item.
Further, when detecting that the current operating environment of the front end meets the operating condition, the obtaining unit 202 is specifically configured to, when obtaining the to-be-processed component in the current item of the front end:
when detecting that the current operation environment of the front end meets the operation condition, acquiring a configuration file in a root directory of a current item of the front end;
and acquiring address information in the configuration file, and acquiring the components to be processed in the current project of the front end according to the address information.
Further, when the obtaining unit 202 determines the component template of the component to be processed according to the component to be processed, it is specifically configured to:
acquiring the component name of the component to be processed in the current project of the front end, and generating a corresponding file to be processed according to the component name;
and determining the component template of the component to be processed according to the generated file to be processed.
Further, the extracting unit 203 analyzes the component template of the component to be processed, and when extracting the template portion of the component to be processed to a new component, is specifically configured to:
analyzing the component to be processed according to the first keyword, and determining template content corresponding to the first keyword;
and determining a new component corresponding to the component to be processed according to the template content and the file to be processed, and extracting the template part of the component to be processed to the new component.
Further, when the extracting unit 203 extracts the style part of the component to be processed to the new component, it is specifically configured to:
analyzing the template of the component to be processed according to a preset pattern keyword, and determining an inline pattern file corresponding to the preset pattern keyword in the template;
analyzing the component to be processed according to a second keyword, and determining a style file corresponding to the second keyword from the component to be processed;
and combining the determined inline style file and the style file to obtain a target style file, and adding the content of the target style file into the new component.
Further, when the determining unit 204 obtains the click event of the component to be processed and determines that the click event of the component to be processed is the click event of the new component, it is specifically configured to:
searching a click event corresponding to a preset click event keyword from the component to be processed according to the preset click event keyword, and acquiring a method function corresponding to the click event;
and adding the click event to the new component according to the method function corresponding to the obtained click event.
Further, before the detecting unit 201 detects the current operating environment of the front end according to the code, it is further configured to:
determining a root directory of the current project according to the current project of the front end, and writing a configuration file in the determined root directory of the current project;
and configuring the address information of the component to be converted in the configuration file.
In the embodiment of the invention, a front-end-based component processing device can add a code for detecting the running environment of the front end and detect the current running environment of the front end according to the code; when detecting that the current operating environment of the front end meets the operating conditions, acquiring a component to be processed in the current project of the front end, and determining a component template of the component to be processed according to the component to be processed; analyzing the component template of the component to be processed, extracting the template part of the component to be processed to a new component, and extracting the style part of the component to be processed to the new component; and acquiring the click event of the component to be processed, determining the click event of the component to be processed as the click event of the new component, and deleting the component to be processed in the current project. By the implementation mode, automatic conversion of the components can be realized, the complexity is reduced, and the performance and the processing efficiency of the components are improved.
Referring to fig. 3, fig. 3 is a schematic block diagram of a computer device according to an embodiment of the present invention. The apparatus in this embodiment as shown in the figure may comprise: one or more processors 301; one or more input devices 302, one or more output devices 303, and memory 304. The processor 301, the input device 302, the output device 303, and the memory 304 are connected by a bus 305. The memory 304 is used for storing computer programs, including programs, and the processor 301 is used for executing the programs stored in the memory 304.
Wherein the processor 301 is configured to invoke the program to perform:
adding a code for detecting the running environment of the front end, and detecting the current running environment of the front end according to the code;
when detecting that the current operating environment of the front end meets the operating conditions, acquiring a component to be processed in the current project of the front end, and determining a component template of the component to be processed according to the component to be processed;
analyzing the component template of the component to be processed, extracting the template part of the component to be processed to a new component, and extracting the style part of the component to be processed to the new component;
and acquiring the click event of the component to be processed, determining the click event of the component to be processed as the click event of the new component, and deleting the component to be processed in the current project.
Further, when detecting that the current operating environment of the front end meets the operating condition, the processor 301 is specifically configured to:
when detecting that the current operation environment of the front end meets the operation condition, acquiring a configuration file in a root directory of a current item of the front end;
and acquiring address information in the configuration file, and acquiring the components to be processed in the current project of the front end according to the address information.
Further, when the processor 301 determines the component template of the component to be processed according to the component to be processed, it is specifically configured to:
acquiring the component name of the component to be processed in the current project of the front end, and generating a corresponding file to be processed according to the component name;
and determining the component template of the component to be processed according to the generated file to be processed.
Further, the processor 301 analyzes the component template of the component to be processed, and when extracting the template portion of the component to be processed to a new component, is specifically configured to:
analyzing the component to be processed according to the first keyword, and determining template content corresponding to the first keyword;
and determining a new component corresponding to the component to be processed according to the template content and the file to be processed, and extracting the template part of the component to be processed to the new component.
Further, when the processor 301 extracts the style part of the component to be processed to the new component, it is specifically configured to:
analyzing the template of the component to be processed according to a preset pattern keyword, and determining an inline pattern file corresponding to the preset pattern keyword in the template;
analyzing the component to be processed according to a second keyword, and determining a style file corresponding to the second keyword from the component to be processed;
and combining the determined inline style file and the style file to obtain a target style file, and adding the content of the target style file into the new component.
Further, the processor 301 obtains the click event of the component to be processed, and when it is determined that the click event of the component to be processed is the click event of the new component, is specifically configured to:
searching a click event corresponding to a preset click event keyword from the component to be processed according to the preset click event keyword, and acquiring a method function corresponding to the click event;
and adding the click event to the new component according to the method function corresponding to the obtained click event.
Further, before the processor 301 detects the current operating environment of the front end according to the code, it is further configured to:
determining a root directory of the current project according to the current project of the front end, and writing a configuration file in the determined root directory of the current project;
and configuring the address information of the component to be converted in the configuration file.
In the embodiment of the invention, the computer equipment can add a code for detecting the running environment of the front end and detect the current running environment of the front end according to the code; when detecting that the current operating environment of the front end meets the operating conditions, acquiring a component to be processed in the current project of the front end, and determining a component template of the component to be processed according to the component to be processed; analyzing the component template of the component to be processed, extracting the template part of the component to be processed to a new component, and extracting the style part of the component to be processed to the new component; and acquiring the click event of the component to be processed, determining the click event of the component to be processed as the click event of the new component, and deleting the component to be processed in the current project. By the implementation mode, automatic conversion of the components can be realized, the complexity is reduced, and the performance and the processing efficiency of the components are improved.
It should be understood that, in the embodiment of the present invention, the Processor 301 may be a Central Processing Unit (CPU), and the Processor may also be other general processors, Digital Signal Processors (DSPs), Application Specific Integrated Circuits (ASICs), Field-Programmable gate arrays (FPGAs) or other Programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, and the like. A general purpose processor may be a microprocessor or the processor may be any conventional processor or the like.
The input device 302 may include a touch pad, a microphone, etc., and the output device 303 may include a display (LCD, etc.), a speaker, etc.
The memory 304 may include a read-only memory and a random access memory, and provides instructions and data to the processor 301. A portion of the memory 304 may also include non-volatile random access memory. For example, the memory 304 may also store device type information.
In a specific implementation, the processor 301, the input device 302, and the output device 303 described in this embodiment of the present invention may execute the implementation described in the method embodiment shown in fig. 1 provided in this embodiment of the present invention, and may also execute the implementation of the front-end-based component processing apparatus described in fig. 2 in this embodiment of the present invention, which is not described herein again.
The embodiment of the present invention further provides a computer-readable storage medium, where a computer program is stored, and when the computer program is executed by a processor, the method for processing a front-end-based component described in the embodiment corresponding to fig. 1 may be implemented, or a front-end-based component processing apparatus according to the embodiment corresponding to fig. 2 may also be implemented, which is not described herein again.
The computer readable storage medium may be an internal storage unit of the front-end based component processing apparatus according to any of the foregoing embodiments, for example, a hard disk or a memory of the front-end based component processing apparatus. The computer readable storage medium may also be an external storage device of the front-end based component processing apparatus, such as a plug-in hard disk provided on the front-end based component processing apparatus, a Smart Memory Card (SMC), a Secure Digital (SD) Card, a Flash memory Card (Flash Card), and the like. Further, the computer readable storage medium may also include both an internal storage unit and an external storage device of the front-end based component processing apparatus. The computer-readable storage medium is used for storing the computer program and other programs and data required by the front-end based component processing apparatus. The computer readable storage medium may also be used to temporarily store data that has been output or is to be output.
The integrated unit, if implemented in the form of a software functional unit and sold or used as a stand-alone product, may be stored in a computer readable storage medium. Based on such understanding, the technical solution of the present invention essentially or partially contributes to the prior art, or all or part of the technical solution can be embodied in the form of a software product stored in a computer-readable storage medium, which includes several instructions for causing a computer device (which may be a personal computer, a terminal, or a network device) to execute all or part of the steps of the method according to the embodiments of the present invention. And the aforementioned computer-readable storage media comprise: a U-disk, a removable hard disk, a Read-Only Memory (ROM), a Random Access Memory (RAM), a magnetic disk or an optical disk, and other various media capable of storing program codes. The computer-readable storage medium may mainly include a storage program area and a storage data area, wherein the storage program area may store an operating system, an application program required for at least one function, and the like; the storage data area may store data created according to the use of the blockchain node, and the like.
It is emphasized that the data may also be stored in a node of a blockchain in order to further ensure the privacy and security of the data. The block chain is a novel application mode of computer technologies such as distributed data storage, point-to-point transmission, a consensus mechanism, an encryption algorithm and the like. A block chain (Blockchain), which is essentially a decentralized database, is a series of data blocks associated by using a cryptographic method, and each data block contains information of a batch of network transactions, so as to verify the validity (anti-counterfeiting) of the information and generate a next block. The blockchain may include a blockchain underlying platform, a platform product service layer, an application service layer, and the like.
The above description is only a part of the embodiments of the present invention, but the scope of the present invention is not limited thereto, and any person skilled in the art can easily conceive various equivalent modifications or substitutions within the technical scope of the present invention, and these modifications or substitutions should be covered within the scope of the present invention.

Claims (10)

1. A method for front-end based component processing, the method comprising:
adding a code for detecting the running environment of the front end, and detecting the current running environment of the front end according to the code;
when detecting that the current operating environment of the front end meets the operating conditions, acquiring a component to be processed in the current project of the front end, and determining a component template of the component to be processed according to the component to be processed;
analyzing the component template of the component to be processed, extracting the template part of the component to be processed to a new component, and extracting the style part of the component to be processed to the new component;
and acquiring the click event of the component to be processed, determining the click event of the component to be processed as the click event of the new component, and deleting the component to be processed in the current project.
2. The method according to claim 1, wherein the obtaining the components to be processed in the current item of the front end when detecting that the current operating environment of the front end meets the operating condition comprises:
when detecting that the current operation environment of the front end meets the operation condition, acquiring a configuration file in a root directory of a current item of the front end;
and acquiring address information in the configuration file, and acquiring the components to be processed in the current project of the front end according to the address information.
3. The method of claim 2, wherein determining the component template for the component to be processed from the component to be processed comprises:
acquiring the component name of the component to be processed in the current project of the front end, and generating a corresponding file to be processed according to the component name;
and determining the component template of the component to be processed according to the generated file to be processed.
4. The method of claim 3, wherein analyzing the component template of the component to be processed to extract the template portion of the component to be processed to a new component comprises:
analyzing the component to be processed according to the first keyword, and determining template content corresponding to the first keyword;
and determining a new component corresponding to the component to be processed according to the template content and the file to be processed, and extracting the template part of the component to be processed to the new component.
5. The method of claim 4, wherein said extracting the style portion of the component to be processed to the new component comprises:
analyzing the template of the component to be processed according to a preset pattern keyword, and determining an inline pattern file corresponding to the preset pattern keyword in the template;
analyzing the component to be processed according to a second keyword, and determining a style file corresponding to the second keyword from the component to be processed;
and combining the determined inline style file and the style file to obtain a target style file, and adding the content of the target style file into the new component.
6. The method according to claim 1, wherein the obtaining the click event of the component to be processed and determining that the click event of the component to be processed is the click event of the new component comprises:
searching a click event corresponding to a preset click event keyword from the component to be processed according to the preset click event keyword, and acquiring a method function corresponding to the click event;
and adding the click event to the new component according to the method function corresponding to the obtained click event.
7. The method of claim 1, wherein prior to said detecting a current operating environment of said front end from said code, further comprising:
determining a root directory of the current project according to the current project of the front end, and writing a configuration file in the determined root directory of the current project;
and configuring the address information of the component to be converted in the configuration file.
8. A front-end based component processing apparatus, comprising:
the detection unit is used for adding a code for detecting the running environment of the front end and detecting the current running environment of the front end according to the code;
the acquisition unit is used for acquiring a component to be processed in the current project of the front end when the current operation environment of the front end is detected to meet the operation condition, and determining a component template of the component to be processed according to the component to be processed;
an extraction unit for analyzing the component template of the component to be processed, extracting the template part of the component to be processed to a new component, and extracting the style part of the component to be processed to the new component;
and the determining unit is used for acquiring the click event of the component to be processed, determining the click event of the component to be processed as the click event of the new component, and deleting the component to be processed in the current item.
9. A computer device comprising a processor, an input device, an output device and a memory, the processor, the input device, the output device and the memory being interconnected, wherein the memory is configured to store a computer program, the computer program comprising a program, the processor being configured to invoke the program to perform the method according to any of claims 1-7.
10. A computer-readable storage medium, characterized in that the computer-readable storage medium stores a computer program which is executed by a processor to implement the method of any one of claims 1-7.
CN202011542922.7A 2020-12-23 2020-12-23 Front-end-based component processing method, device, equipment and storage medium Pending CN112540755A (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202011542922.7A CN112540755A (en) 2020-12-23 2020-12-23 Front-end-based component processing method, device, equipment and storage medium

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202011542922.7A CN112540755A (en) 2020-12-23 2020-12-23 Front-end-based component processing method, device, equipment and storage medium

Publications (1)

Publication Number Publication Date
CN112540755A true CN112540755A (en) 2021-03-23

Family

ID=75017159

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202011542922.7A Pending CN112540755A (en) 2020-12-23 2020-12-23 Front-end-based component processing method, device, equipment and storage medium

Country Status (1)

Country Link
CN (1) CN112540755A (en)

Similar Documents

Publication Publication Date Title
CN111176996A (en) Test case generation method and device, computer equipment and storage medium
CN112015430A (en) JavaScript code translation method and device, computer equipment and storage medium
WO2019165706A1 (en) Expression processing method, apparatus, device, and computer readable storage medium
WO2017020459A1 (en) Method and apparatus for configuring plugin package for host
WO2023155940A1 (en) Mini program compiling method and apparatus, mini program running method and apparatus, and storage medium
WO2021175053A1 (en) Method and apparatus for executing functional module in virtual machine
KR20150061203A (en) Method for providing embedded software development tools for supporting embedded software development environment based on native building and apparatus thereof
CN111984262A (en) WeChat cascading style sheet file processing method, device, equipment and storage medium
CN111045654A (en) Vue-based method and device for quickly generating common instructions, computer equipment and storage medium
US20180314683A1 (en) Method and device for processing natural language
CN111596970B (en) Method, device, equipment and storage medium for dynamic library delay loading
CN106502707B (en) Code generation method and device
CN112363814A (en) Task scheduling method and device, computer equipment and storage medium
CN111488286A (en) Method and device for independently developing Android module
CN111338697A (en) Device and method for one-key setting by using HID keyboard
US20230418566A1 (en) Programmatically generating evaluation data sets for code generation models
US20230419036A1 (en) Random token segmentation for training next token prediction models
CN112540755A (en) Front-end-based component processing method, device, equipment and storage medium
CN116361793A (en) Code detection method, device, electronic equipment and storage medium
CN113721928B (en) Binary analysis-based dynamic library clipping method
CN115629795A (en) Configuration method and device of executable file and electronic equipment
CN111399842B (en) Code compiling method and device
CN114356290A (en) Data processing method and device and computer readable storage medium
CN112685013A (en) CSS code optimization method based on front-end vue project and related equipment
US12014155B2 (en) Constrained prefix matching for generating next token predictions

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination