Preface:
Recently, I need to build a set of code template based on UNIApp to adapt to the rapid packaging deployment of various platforms. In order to improve code reuse rate and productivity, I need to build a set of elegant front-end project architecture. Below, I will share and record my encapsulation.
I’ve tentatively divided code encapsulation into three layers:
1 Underlying encapsulation
Cache handling, encapsulation, third-party API user authentication information processing, network request, the application configuration, data statistics, data points, the global page object hijacked encapsulation, general utility class encapsulation (time, wild ginseng, file download, upload, encryption, decryption, long links, audio and video player), WebRTC real-time communication technology (web page), The webview communication
Interpretation: this layer is basically js logic code encapsulation, can be loaded on demand
2 Application function module layer
Integral module, lottery module, mall module, order module, membership module, task module
Interpretation: This layer is mainly interface capabilities, pages and related components of the package
3 Component Layer
Home page component, personal center component, detail page component, address management component, public popover, data statistics – canvas
Interpretation: this level is pure component encapsulation, with the interface, data is not linked, the role of the page needs to use components are divided into small parts, improve the reuse and maintainability.
To continue, after I will continue to update, there are valuable comments welcome to point out in the comment area, thank you.