Home > Article > Web Front-end > How to quote layui
How to quote layui
- 藏色散人Original
- 2019-07-20 11:47:164782browse
How to quote layui
How to quickly introduce layui into the project after downloading it, layui is a Classic modular front-end UI, its modules are based on the asynchronous module loading method implemented internally by layui.js, which is different from the commonly known AMD specifications. There is a set of module loading specifications that are completely defined by layui. Through preloading, this It is also the method recommended by layui officials. To introduce the downloaded source code into the project, you only need to introduce the two files layui.css and layui.js, and complete the loading of the modules to be used through the layui.use() method.
As shown in the following example: Load the stable version of jquery and layer components built into layui
[When we first come into contact with layui, if we have not yet had the patience to read the official layui documentation, we can first remember Pay attention to the usage format and usage specifications. Once you can use it normally, go deeper. Don't get hung up on the details and stop moving forward. I have met some users who communicated about the use of layui. They read the source code of layui without reading the document. The result I am still in the fog, mistakenly thinking that going straight to the source code is the best way, blinding my eyes with a leaf and not seeing the mountain, plugging my ears with beans and not hearing the thunder;
Personal opinion: If you feel that you should ignore the documentation and read the source code directly while studying. The method is suitable for me and I won’t comment for now, but if it is used for work, I personally think that this method is the most clumsy. Therefore, the official documents are a must-read for beginners, instead of going directly to read the source code. This series of documents can be used as larryms Basic prerequisites for using the product. Recommended reading if you are new to it. If there are any flaws, please correct them in the comments]
code
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="layui/css/layui.css">
<!-- your css link -->
</head>
<body>
<!-- you html code -->
<script type="text/javascript" src="layui/layui.js"></script>
<script>
layui.use(['jquery','layer'],function(){
var $ = layui.$,
layer = layui.layer;
#your js coding
});
</script>
</body>
</html>Remarks:
The preloading method is better than on-demand loading in terms of code maintainability, reading convenience, and code elegance and beauty to avoid confusion caused by the visible layui.use(). We have encountered extreme demands on website performance for users who use on-demand Loading method [On-demand loading is not recommended]. On-demand loading is prone to errors and inconvenient for later maintenance if the scope and other relationships of variables are not handled properly. Of course, in some specific cases, it can be used with layui.cache.xx It is also a relatively good way to use on-demand loading of global variables;
But at the same time, it is not recommended to directly introduce layui.all.js to load it all at once (the full loading method seems to lose the meaning of layui modularization); layui Preloading of module components is relatively common in larryms products.
For more technical articles related to Layui, please visit the Layui Framework Tutorial column to learn!
The above is the detailed content of How to quote layui. For more information, please follow other related articles on the PHP Chinese website!