zoukankan      html  css  js  c++  java
  • 小程序跳转页面选择数据

    大致的效果如下:

         

    1. A页面上的相关功能和代码

    (1) js里关键代码 

      /**
       * 页面的初始数据
       */
      data: {
        selectedShop:{
          shopId:"",
          shopName:"",
          linKTel:"",
          address:"",
        }
      },
     //点击跳转选择页面事件
     selectShop:function(e)
     {
       var url = "../map/index";
       var shopId = this.data.selectedShop.shopId;
       if(shopId!='')
       {
         url += "?shopId="+ shopId
       }
       wx.navigateTo({
         url: url
       })
     },
    (2) 页面代码 : bindtap="selectShop"
    2. B页面上的相关功能和代码
    (1)js里关键代码 
      /**
       * 页面的初始数据
       */
      data: {
        shopId:"", //选中的店铺ID
      },

      /**
       * 生命周期函数--监听页面加载
       */
      onLoad: function (options) {
        var shopId = options.shopId;
        //console.log(shopId);
        this.setData({ shopId:shopId });
        })
      },
    //选择事件
      selectItemClick:function(e)
      {
        var shopId = e.currentTarget.dataset["id"];
        var shopName = '', linKTel='',address='';
        var pages = getCurrentPages();
        var prevPage = pages[pages.length-2]; //上一个页面
     //设定上一个页面A页面的data里面 selectedShop 值
        prevPage.setData({
          ['selectedShop.shopId']:shopId,
          ['selectedShop.shopName']:shopName,
          ['selectedShop.linKTel']:linKTel,
          ['selectedShop.address']:address,
        })
        wx.navigateBack({
          delta: 1,
        })
      }
    注:数据加载时需要根据传过来的shopId设定选中项
    (2)页面代码 :
    <view class="shop_item" wx:for="{{shopDatas}}" wx:key="{{item.shopId}}" bindtap="selectItemClick" data-id="{{item.shopId}}"></view>
     
  • 相关阅读:
    Beta版本冲刺第二天 12.6
    Beta版本冲刺第一天 12.5
    Linux学习(2)—— 图形化界面
    Linux学习(1)—— 虚拟机安装Linux系统
    IntelliJ IDEA使用
    spring+springmvc+hibernate 整合
    新的篇章
    软件工程实践总结作业——个人作业
    Beta版本冲刺———第七天
    Beta版本冲刺———第六天
  • 原文地址:https://www.cnblogs.com/wsk198726/p/15636896.html
Copyright © 2011-2022 走看看