Maison > interface Web > Tutoriel Layui > Qu'est-ce que le framework Layui

Qu'est-ce que le framework Layui

爱喝马黛茶的安东尼
Libérer: 2019-07-11 13:22:05
original
11772 Les gens l'ont consulté

Qu'est-ce que le framework Layui

Introduction

layui (homophone : UI-like) est un framework d'interface utilisateur frontal écrit en utilisant son propre Spécifications du module, suivant la forme d'écriture et d'organisation du HTML/CSS/JS natif, le seuil est extrêmement bas et il est prêt à l'emploi. Il est minimaliste à l'extérieur mais plein à l'intérieur. Il est léger et riche en composants, chaque détail, du code principal à l'API, a été soigneusement conçu, ce qui le rend très approprié pour le développement rapide d'interfaces. La première version de layui a été publiée à l'automne doré 2016. Elle est différente de ces frameworks d'interface utilisateur basés sur la couche inférieure de MVVM, mais elle ne va pas à l'encontre de la tendance, mais croit au retour à la nature. Pour être précis, il est plus adapté aux programmeurs côté serveur. Vous n'avez pas besoin de vous impliquer dans la configuration complexe de divers outils frontaux. Il vous suffit de faire face au navigateur lui-même, ainsi qu'à tous les éléments et interactions que vous avez. le besoin peut être trouvé à portée de main.

layui est compatible avec tous les navigateurs actuellement utilisés par les humains (sauf IE6/7) et peut être utilisé comme solution de développement rapide pour les systèmes backend côté PC et les interfaces frontales.

Obtenez Layui

1. Téléchargez depuis la page d'accueil du site officiel

Téléchargez Layui sur le site officiel : https://www.layui.com /Télécharger sur layui La dernière version, qui a été construite automatiquement, est plus adaptée à une utilisation dans des environnements de production. La structure des répertoires est la suivante :

2. Téléchargement du référentiel Git

Vous pouvez également obtenir le package de développement complet de layui via GitHub ou Code Cloud, afin de pouvoir effectuer un développement secondaire, ou Fork layui et contribuez à nous Solution

3. Installation de npm

npm install layui-src
Copier après la connexion

Généralement utilisé pour la gestion de WebPack

Recommandations associées : "Tutoriel du framework layui"

Utilisation

1. Utilisation modulaire (recommandée)

Nous vous recommandons de suivre les spécifications du module de layui pour créer un fichier d'entrée et de le charger via layui. use() Le fichier d'entrée est le suivant :

<script>
layui.config({
  base: &#39;/js/modules/&#39; //你存放新模块的目录,注意,不是layui的模块目录
}).use(&#39;index&#39;); //加载layui入口
</script>    
上述的 index 即为你/js/modules/ 目录下的 index.js,它的内容如下:
/**
项目JS主入口
以依赖layui的layer和form模块为例
**/
layui.define([&#39;layer&#39;, &#39;form&#39;], function(exports){
var layer = layui.layer
,form = layui.form;
layer.msg(&#39;Hello World&#39;);
exports(&#39;index&#39;, {}); //注意,这里是模块输出的核心,模块名必须和use时的模块名一致
});
Copier après la connexion

2 Utilisation non modulaire

Si vous n'aimez pas l'organisation modulaire de layui, vous pouvez certainement utiliser le « chargement unique » dans. de cette façon, nous emballons et fusionnons layui.js et tous les modules séparément dans un fichier js complet. Vous pouvez directement importer ce fichier lorsque vous l'utilisez. Lorsque vous adoptez cette méthode, vous n'avez plus besoin de charger le module via la méthode layui.use(), vous pouvez l'utiliser directement, comme :

<script src="../layui/layui.all.js"></script>
<script>
//由于模块都一次性加载,因此不用执行 layui.use() 来加载对应模块,直接使用即可:
!function(){
//无需再执行layui.use()方法加载模块,直接使用即可
var form = layui.form
,layer = layui.layer;
//…
}();
</script>
Copier après la connexion

Mais il faut savoir qu'adopter cette méthode signifie la modularisation de layui a perdu son sens. Mais il est indéniable qu’il sera plus simple et plus direct à utiliser.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal