溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

微信小程序仿攜程系統(tǒng)如何開發(fā)

發(fā)布時(shí)間:2022-03-15 10:48:58 來源:億速云 閱讀:152 作者:iii 欄目:開發(fā)技術(shù)

這篇文章主要介紹了微信小程序仿攜程系統(tǒng)如何開發(fā)的相關(guān)知識(shí),內(nèi)容詳細(xì)易懂,操作簡(jiǎn)單快捷,具有一定借鑒價(jià)值,相信大家閱讀完這篇微信小程序仿攜程系統(tǒng)如何開發(fā)文章都會(huì)有所收獲,下面我們一起來看看吧。

查詢功能的實(shí)現(xiàn)

1.首先需要在查詢之前獲取輸入的所在城市以及到的城市,以及時(shí)間的選擇,通過這些條件去篩選,所以需要在點(diǎn)擊查詢按鈕的時(shí)候綁定一個(gè)時(shí)間,需要攜帶參數(shù)去進(jìn)行查詢

<navigator class="search"  url="/pages/trainBuyContent/trainBuyContent?from={{from}}&to={{to}}&trainTime={{startDate}}">查詢</navigator>

2.需要到跳轉(zhuǎn)的頁面接收參數(shù)通過onload事件的options獲取

var from = options.from;
    var to = options.to;
    var trainTime = options.trainTime;

3.最重要的是篩選出相關(guān)數(shù)據(jù),這里需要一個(gè)for循環(huán)的判斷語句,在請(qǐng)求數(shù)據(jù)地址URL的時(shí)候,通過for循環(huán)和if語句找出相對(duì)應(yīng)的數(shù)據(jù)文件里面所對(duì)應(yīng)的json數(shù)據(jù)。

wx.request({
      url: API_BASE,
      success: (res) => {
        for(var i=0;i<res.data.data.trainList.length;i++){
          if (from == res.data.data.trainList[i].from && to == res.data.data.trainList[i].to && trainTime == res.data.data.trainList[i].trainTime){
            temp.push(res.data.data.trainList[i]);
          }
        }
        this.setData({
          searchedList:temp
        })
      }
    })

4.這時(shí)候再在頁面通過for循環(huán)輸出就可以了

wx:for="{{searchedList}}"
wx:key="{{item.id}}"
temp.push(res.data.data.trainList[i]);
this.setData({
          searchedList:temp
        })

*小程序頁面?zhèn)髦档姆绞剑?.url傳值2.本地儲(chǔ)存3.全局的app對(duì)象

訂單查詢的實(shí)現(xiàn)

這里我采用了全局的app對(duì)象保存

1.先獲取全局對(duì)象,然后在點(diǎn)擊確定購買的success回調(diào)函數(shù)的時(shí),去獲取所有的信息,以一個(gè)json格式去獲取

const app = getApp();
var trainedList = app.globalData.trainedList;
var trainItem = {
          from: this.data.from, 
          to: this.data.to,  
          trainNum: this.data.trainNum,
          trainTime: this.data.trainTime,
          totalPrice: this.data.totalPrice
        };
trainedList.push(trainItem);

2.然后在相應(yīng)的頁面去獲取這個(gè)全局的數(shù)組

onLoad: function (options) {
    this.setData({
      trainedList: app.globalData.trainedList
    })
    
  },

關(guān)于“微信小程序仿攜程系統(tǒng)如何開發(fā)”這篇文章的內(nèi)容就介紹到這里,感謝各位的閱讀!相信大家對(duì)“微信小程序仿攜程系統(tǒng)如何開發(fā)”知識(shí)都有一定的了解,大家如果還想學(xué)習(xí)更多知識(shí),歡迎關(guān)注億速云行業(yè)資訊頻道。

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI