快应用页面带参数跳转

最近参加了华为举办的一个活动,做华为快应用,语法啥的和vue很类似,就是很多标签,属性不太支持,只能转变思路去实现自己想要的功能。但是在想要在每个tab页做一个固定在顶部搜索框时,切换tab时,每个页面对应的搜索框没法隐藏,无奈之下,只能让所有tab页公用一个搜索框。再根据在点击不同tab页时获取当前下标值cuurentindex,z再使用router跳转页面时传递一个参数key,进入到搜索页时在页面初始化时获取key值,再根据key进行判断显示不同的搜索页面

代码实现

tab.ux

 switchContent: function (e) {
      let index = e.index;
      if(index === 3){
        this.className = 'none'
      }else{
        this.className = ''
      }
      currentIndex = e.index;
      for (let i = 0; i < this.data.list.length; i++) {
        let element = this.data.list[i];
        element.show = false;
        if (i === index) {
          element.show = true;
          this.$page.setTitleBar({ text: element.title, menu: false });
        }
      }
    },
    toSearch(){
         if(currentIndex === 0){
          router.push({         
            uri: '/Index/component/Search_Page',
            params: { key:"福彩3D"}
            })
         }
         if(currentIndex === 1){
          router.push({         
            uri: '/Index/component/Search_Page',
            params: { key:"双色球"}
            })
         }
         if(currentIndex === 2){
          router.push({         
            uri: '/Index/component/Search_Page',
            params: { key:"七乐彩"}
            })
         }
    }

search_page.ux

 onInit () {
      if(this.key === "双色球"){
          this.$page.setTitleBar({
          text: '双色球查询',
          textColor: '#ffffff',
          backgroundColor: '#ff685d',
          backgroundOpacity:1,
          menu:true
        })
      }
      if(this.key === "福彩3D"){
          this.$page.setTitleBar({
          text: '福彩3D查询',
          textColor: '#ffffff',
          backgroundColor: '#ff685d',
          backgroundOpacity:1,
          menu:true
        })
      }

      if(this.key === "七乐彩"){
          this.$page.setTitleBar({
          text: '七乐彩查询',
          textColor: '#ffffff',
          backgroundColor: '#ff685d',
          backgroundOpacity:1,
          menu:true
        })
      }

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值