旅行小程序的盛行，，，，
，，让许多开发商最先重视旅行出行小程序的生长，，，，
，，这里为各人介绍仿写携程小程序的案例，，，，
，，来实现一些基本功效。。。。。
。

为了更好的开发，，，，
，，我们需要准备我们需要的工具：

• Vscode：这里主要用来详细代码的编写
• 微信开发者工具：通过这个看效果图
• EasyMock: 通过这个网站可以伪造一些数据来供我们使用，，，，
  ，，很是利便。。。。。
  。

详细实现

功效效果如下

盘问功效的实现

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

3.通过一个for循环让其输出在页面

其他功效

尚有一部分功效未能展示或者未完善，，，，
，，请各人见谅。。。。。
。

源码地点

GitHub地点：github.com/yrq1429/yrq…

 

【本站声明】
  1、本站文章中所选用的图片及文字泉源于网络以及用户投稿，，，，
，，由于未联系到知识产权人或未发明有关知识产权的挂号，，，，
，，若有知识产权人并不肯意我们使用，，，，
，，若是有侵权请连忙联系。。。。。
。
  2、本网站差池文章中所涉及的内容真实性、准确性、可靠性认真，，，，
，，仅系客观性形貌，，，，
，，如您需要相识该类商品/服务详细的资讯，，，，
，，请您直接与该类商品/服务的提供者联系。。。。。
。