wex5 實戰 常用代碼模型集合


 

     學習和使用wex5有一段時間了,發現有些代碼,雖然沒有自動提功能,但是幾乎每個頁面或功能都要用到,索性做成了代碼模板,當需要的時候直接拷過來用,簡化過程,減少開發時間,改改就行。

     一 事件監聽模型 

        //頁面加載后,在需要監聽的頁面上設置監聽事件     

      Model.prototype.modelLoad = function(event) {
           justep.Shell.on("onUserChanged", this.onUserChanged, this);

         }

      //卸載用戶變更事件

       Model.prototype.modelUnLoad = function(event) {
     justep.Shell.off("onUserChanged", this.onUserChanged);
     };

     //具體事件

      Model.prototype.onUserChanged = function(event) {
       this.comp("userData").refreshData();
      };

    二   過濾模型

        數據過濾分幾種情況

        1. 定值過濾       

       this.comp("userData").setFilter("userFilter", "p_ID = '123'");
       this.comp("userData").refreshData();

        2.變量過濾      

        this.comp("userData").setFilter("userFilter", "p_ID = '" + this.userUUID + "'");
        this.comp("userData").refreshData();

       3.復雜字段模糊查詢

         在多個關鍵字模糊查詢中,非空判斷與過濾器清空,非常重要

     var key = this.getElementByXid("keyInput").value; // 取出輸入關鍵字的值
     if (key !== null && key !== "") { // 非空判斷,避免sql報錯
    goodsData.setFilter("keyFilter", "market_goodsstore.p_name like '%" + key + "%' or market_goodsstore.p_title like '%" + key + "%' or market_goodsstore.p_brand     like '%" + key
     + "%' or market_goodsstore.p_postAddress like '%" + key + "%' or market_goodsstore.p_summary like '%" + key + "%' "); // sql模糊查詢拼接
   // product_product 是數據庫表別名.p_name是字段名
   } else {
    goodsData.filters.clear(); // 空值清除過濾器
   }

     (注)filter的過濾條件對應sql中的where的內容,注意字符串拼接方法與換行

 三  頁面跳轉傳參模型

      1 無參跳轉     

       justep.Shell.showPage("goodsEdit");

      2有參跳轉   

     justep.Shell.showPage("goodsEdit", {
      goodsId : goodsId,
     });

      3 帶來源頁面有參跳轉      

     justep.Shell.showPage("goodsEdit", {
    goodsId : goodsId,
     from : "goodsManager"
    });

      from為自定義鍵,在多頁面共用子頁面的跳轉中,告訴子頁面,父頁面是誰,子頁面完成功能后跳轉回到父頁面。

四  頁面接參模型

     1 簡單接參     

    Model.prototype.modelParamsReceive = function(event) {
    if (event.params !== undefined) {
    this.orderId = this.params.orderId;
     }
     };

     只要參數非空,即接參並存儲

    2 復雜來源頁面接參

      

Model.prototype.modelParamsReceive = function(event) {
if (this.params !== undefined) {
if (this.params.from === "register") {
if (this.userUUID != this.params.userUUID) {
this.userUUID = this.params.userUUID;
this.comp("userData").setFilter("userFilter", "p_ID = '" + this.userUUID + "'");
this.comp("userData").refreshData();
this.phoneInput = this.comp("userData").val("p_phone");
this.passwordInput = this.comp("userData").val("p_password");
this.comp("phoneInput").val(this.phoneInput);
this.comp("passwordInput").val(this.passwordInput); // 將注冊頁的信息傳回來接收,為了信息安全,傳參為userUUID,然后過濾出相應的用戶信息
this.from = "mine";
}
} else if (this.params.from === "mine") {
this.from = this.params.from;
} else if (this.params.from === "home") {
this.from = this.params.from;
}
}
};

    目是只有一個,根據不同的來源頁面,執行不同的數據刷新或其它操作

五  data套裝模型

     1  newdata  新增,代碼提示里有,這里不說了

     2  保存      

this.comp("goodsData").saveData( {
"ansyc" : false,
"onSuccess" : function(event) {
event.source.saveData({
"onSuccess" : function(event) {
event.source.refreshData();
}
});
}
});

      3 刪除

Model.prototype.delBtnClick = function(event) {
var rows = this.comp("goodsData").find([ "p_choose" ], [ "1" ]);
this.comp("goodsData").deleteData(rows, {
"confirm" : false,
"onSuccess" : function(event) {
event.source.saveData({
"onSuccess" : function(event) {
event.source.refreshData();
}
});
}
});
};

   data相關動作,套接在onsuccess回調函數里,大家不用去每次調用data的事件來觸發,拷貝使用,直接改下data組件id,復用性強。

六   點擊當前行模型

     var row = event.bindingContext.$object;

     這里要注意,this.comp("data").getCurrentRow,會重復得到當行前數據,點擊第二次才能切換到其它行

七  list 嵌套模型

     分為兩情情況

     1  list外嵌套,list各不相干,只是關聯過濾

        

     如圖,左側是城市list,右側是景點list,景點根據城市過濾,重點在filter寫法

     

      $row.val("t_city")  左側是景點當前行的城市字段

      $model.cityData.val("t_shi")  右側是城市data中的城市字段

      兩者做==對比判斷,為true時過濾執行

      這個相對簡單,在過濾時有提示。

   2  list內嵌套,一個list內再內嵌一個list

       

       商鋪是list,商鋪里的商品也是list

       過濾沒有提示,用的是行別名。具體如下:

       商鋪行別名:

      

      官方視頻里講過,今天重新拿來,對比一下。

     商品過濾條件寫法:

     

      $row.val('fShopID') 左側,還是當前行的商鋪字段

       shopRow.val('id')  右側,是商鋪行別名的id值。注意,是行別名的字段值。很多人沒仔細研究官方視頻,到這里用提示的寫法,出來是 $model.shopData.val("id"),

       不用行別名,就不是商鋪的當前行,是整個商鋪data,所以不能過濾成功。

八  回車監聽

    回車,執行,不用去特意點擊,好多頁面都要用

    $(document).keyup(function(event) {
     if (event.keyCode == 13) {
     $("#searchBtn").trigger("click");
      }

     });

    一看,也真是夠簡單的。

九  選擇模型

    1 單選

       簡單,不作說明

     2 全選 模型

    根據全選按鈕的值,遍歷data里的值。真是經常用的東西

cartData.each(function(obj) {
if (choose) {
cartData.setValue("p_choose", "1", obj.row);
} else {
cartData.setValue("p_choose", "", obj.row);
}
});

  3  返選模型

      在全選基礎上,返選。其實本質是先把已選或未選的值先歸0后重新賦值。

Model.prototype.invertChooseChange = function(event) {
var chineseData = this.comp("chineseData");
if (this.comp("invertChoose").val() == 1) {
chineseData.each(function(obj) {
if (chineseData.getValue("choose", obj.row) == 0) {
chineseData.setValue("choose", "1", obj.row);
} else {
chineseData.setValue("choose", "0", obj.row);
}
});
} else {
chineseData.each(function(obj) {
if (chineseData.getValue("choose", obj.row) == 0) {
chineseData.setValue("choose", "1", obj.row);
} else {
chineseData.setValue("choose", "0", obj.row);
}
});
}
chineseData.saveData();
chineseData.refreshData();
};

      今天選總結到這里,以后會繼續更新,分享給大家。

 

相關視頻制作完成,上傳優酷。教學app制作中。我是邯鄲戲曲開發,tel:15175073123,qq:1017945251

 

 

 掃描二維碼,看高清教學視頻。

     

 

        


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM