微信小程序跳转页面传多个参数（拼接）

Dear 丶 2022-10-13 12:53 102阅读 0赞

//事件处理函数,带着4个参数跳转，姓名时间被访部门
        bindViewTapsuccess: function() {
            wx.navigateTo({
                //url: '../success/success?id=' + id,
                
                url: '../success/success?a=' + this.data.name + '&b=' + this.data.phone+'&c='+this.data.phone+'&d='+ this.dataidNumber
            })
        },

test.wxml

test.js

// pages/addsign/addsign.js
    const app = getApp()
    Page({
    
        data: {
            name: '',
            subscribeTime: '2021-6-17 18:00',
            visitCompany: '',
            interviewee: '',
        },
        
        //事件处理函数,带着4个参数跳转，姓名时间被访部门
        bindViewTapsuccess: function() {
            wx.navigateTo({
                //url: '../success/success?id=' + id,
                url: '../nav/nav?name=' + this.data.name + '&subscribeTime=' + this.data.subscribeTime+'&interviewee='+this.data.interviewee+'&visitCompany='+ this.data.visitCompany
            })
        },
    
        
        onConfirm(e) {
            // this.setData({
            //   time: this.formatDate(e.detail),
            //   show: false
            // })
        },
        /**
         * 生命周期函数--监听页面加载
         */
        onLoad: function(options) {},
          setInput:function(e) {
            const {name} = e.target.dataset
            this.data[name] = e.detail.value
            this.setData(this.data)
          },
        confirmPublish: function() {
            const data = {}
            data.name = this.data.name
            data.subscribeTime = this.data.subscribeTime
            data.visitCompany = this.data.visitCompany
            data.interviewee = this.data.interviewee
            console.log(JSON.stringify(data))
            
        },
    })

跳转界面，接受参数  
nav.wxml

<form catchsubmit="confirmPublish">
            <view class="successlist">
                <span>
                    预约人
                </span>
                <span>
                    {
        {name}}
                </span>
            </view>
            <view class="successlist">
                <span>
                    预约时间
                </span>
                <span>
                    {
        {subscribeTime}}
                </span>
            </view>
            <view class="successlist">
                <span>
                    被访姓名
                </span>
                <span>
                    {
        {interviewee}}
                </span>
            </view>
            <view class="successlist">
                <span>
                    被访部门
                </span>
                <span>
                    {
        {visitCompany}}
                </span>
            </view>
    </form>

nav.js

// pages/instructions/instructions.js
    Page({
    
        /**
         * 页面的初始数据
         */
        data: {
        
    
        },
    
        /**
         * 生命周期函数--监听页面加载
         */
        onLoad: function(options) {
            console.log(options)
             // 生命周期函数--监听页面加载
                this.setData({
                  name: options.name,
                  subscribeTime: options.subscribeTime,
                  visitCompany: options.visitCompany,
                  interviewee: options.interviewee,
                  
                })
    
        },
    
        /**
         * 生命周期函数--监听页面初次渲染完成
         */
        onReady: function() {
    
        },
    
        /**
         * 生命周期函数--监听页面显示
         */
        onShow: function() {
    
        },
    
        /**
         * 生命周期函数--监听页面隐藏
         */
        onHide: function() {
    
        },
    
        /**
         * 生命周期函数--监听页面卸载
         */
        onUnload: function() {
    
        },
    
        /**
         * 页面相关事件处理函数--监听用户下拉动作
         */
        onPullDownRefresh: function() {
    
        },
    
        /**
         * 页面上拉触底事件的处理函数
         */
        onReachBottom: function() {
    
        },
    
        /**
         * 用户点击右上角分享
         */
        onShareAppMessage: function() {
    
        }
    })

![bf5d932c86782ed296875e47b8f343ac.png][]

[bf5d932c86782ed296875e47b8f343ac.png]: /images/20221005/e31ab76ca33e43b6a6e5d596cdd3daec.png