怎么在Layui中自定義模塊

本篇文章為大家展示了怎么在Layui中自定義模塊，內容簡明扼要并且容易理解，絕對能使你眼前一亮，通過這篇文章的詳細介紹希望你能有所收獲。

使用layui.define()方法來擴展模塊、當然模塊中你也可以使用layui的其他方法、如下

layui.define('layer', callback);

在定義擴展模塊的時候、我需要使用layui的layer模塊、然后在回調函數中定義自己的方法

layui.define(["layer","jquery"],function (exports) {
  var obj = {
    login : function (url,data,$,targetUrl) {
      $.post(url,{code:data.code},function (res) {
       if (res.code&&res.code==400){
         layer.msg(res.msg,{icon:1},function () {
           window.location.href = targetUrl;
         });
       }else{
         layer.msg(res.msg,{icon:1},function () {
           window.location.href = targetUrl;
         });
       }
      });
    }
  }
  exports("login",obj);
});

上述代碼中定義了一個login模塊、以便在我登錄的時候、不需要寫過度的代碼即可實現登錄、讓頁面看起來更清爽【無任何雜質】

那么模塊定義完了、怎么使用呢？

<script type="text/javascript">
  layui.config({
    base: '/static/admin/js/module/'//模塊存放的目錄
  }).use(['jquery','element','form','login'],function () {
    var $ = layui.jquery,
      form = layui.form,
      element = layui.element,
      login = layui.login;
    form.on("submit(subBtn)",function (data) {
      //獲取表單的值
      var field = data.field;
      login.login("{:url('Login/doLogin')}",field,$,"{:url('Index/index')}");
      return false;
    });
  });
</script>

上述內容就是怎么在Layui中自定義模塊，你們學到知識或技能了嗎？如果還想學到更多技能或者豐富自己的知識儲備，歡迎關注億速云行業資訊頻道。