微信小程序仿携程系统如何开发

这篇文章主要介绍了微信小程序仿携程系统如何开发的相关知识，内容详细易懂，操作简单快捷，具有一定借鉴价值，相信大家阅读完这篇微信小程序仿携程系统如何开发文章都会有所收获，下面我们一起来看看吧。

查询功能的实现

1.首先需要在查询之前获取输入的所在城市以及到的城市，以及时间的选择，通过这些条件去筛选，所以需要在点击查询按钮的时候绑定一个时间，需要携带参数去进行查询

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

2.需要到跳转的页面接收参数通过onload事件的options获取

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

3.最重要的是筛选出相关数据，这里需要一个for循环的判断语句，在请求数据地址URL的时候，通过for循环和if语句找出相对应的数据文件里面所对应的json数据。

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.这时候再在页面通过for循环输出就可以了

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

*小程序页面传值的方式：1.url传值2.本地储存3.全局的app对象

订单查询的实现

这里我采用了全局的app对象保存

1.先获取全局对象，然后在点击确定购买的success回调函数的时，去获取所有的信息，以一个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.然后在相应的页面去获取这个全局的数组

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

关于“微信小程序仿携程系统如何开发”这篇文章的内容就介绍到这里，感谢各位的阅读！相信大家对“微信小程序仿携程系统如何开发”知识都有一定的了解，大家如果还想学习更多知识，欢迎关注亿速云行业资讯频道。