怎么在Layui中自定義模塊

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

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

layui.define('layer', callback);

在定義擴(kuò)展模塊的時(shí)候、我需要使用layui的layer模塊、然后在回調(diào)函數(shù)中定義自己的方法

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);
});

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

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

<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>

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