zoukankan      html  css  js  c++  java
  • 关于微信小程序的动态跳转

    最近在研究微信小程序。在做一个简单的购物小程序时,遇到一个问题:如何通过扫码实现动态的跳转页面功能,

    通过研究终于找到了解决方法:

    首先当然要实现扫码解析功能js的代码:

     click: function () {
        var that = this;
        var show;
        
        wx.scanCode({
          success: (res) => {
            // this.show = "--result:" + res.result + "--scanType:" + res.scanType + "--charSet:" + res.charSet + "--path:" + res.path;
            this.show = res.result;
            that.setData({
              show: this.show
            })
          },
          fail: (res) => {
            wx.showToast({
              title: '失败',
              icon: 'success',
              duration: 2000
            })
          },
          complete: (res) => {
          }
        })
      },
    

      wxml如下:

    <view class="saoma" bindtap="click">点我扫一扫</view>  
    

      然后在解析的代码中添加跳转的代码在:

       wx.scanCode({
          success: (res) => {
            // this.show = "--result:" + res.result + "--scanType:" + res.scanType + "--charSet:" + res.charSet + "--path:" + res.path;
            this.show = res.result;
            that.setData({
              show: this.show
            })
              wx.navigateTo({
                url: '../dingdan/dingdan'
              })
          },
    

      那如何实现动态的跳转呢?其实引用data中的show变量就好,首先

    url: '../dingdan/dingdan'的格式是这样动态的格式就是:
     var test = this.data.show; //读取data中show的值     
              wx.navigateTo({
                //url: '../dingdan/dingdan?money=100'
                url: '../' + test + '/' + test//动态跳转页面
              })
    

      通过代码我们可以知道变量test其实为data的show值,而show的值通过上边的扫码解析实现了动态改变show的值

    如果我们要跳转到url: '../no1/no1'的页面只要我们生成内容为‘no1’的二维码就可以了

    *要跳转到url: '../no1/no1'首先要app.json存在pages/no1/no1

    *要有no1这个文件夹

    *no1的二维码解析后show将变为no1,所以要在改变后才引用show才动态跳转

  • 相关阅读:
    SQL判断如果一列值为null则取另一列值代替 isnull()
    关于js的function.来自百度知道的回答,学习了.
    OSI七层与TCP/IP五层网络架构
    504 Gateway Time-out
    nginx中关于并发数的问题worker_connections,worker_processes
    php实现二叉树的遍历
    nginx负载均衡的简单实现
    linux shell数据重定向
    数据库范式的思考以及数据库的设计
    msyql中myism和innodb的区别
  • 原文地址:https://www.cnblogs.com/weizhiing/p/7576031.html
Copyright © 2011-2022 走看看