美文网首页
关于微信小程序页面跳转后如何刷新当前页面:

关于微信小程序页面跳转后如何刷新当前页面:

作者: 汪卫国 | 来源:发表于2020-01-19 17:45 被阅读0次

    场景介绍:在后台管理系统当中,我们都会涉及到对人员的增删改查和权限分配的问题。在列表页点击添加按钮,然后会跳转到增加用户的界面,在添加用户界面添加用户信息,点击确定后就会跳转到用户列表界面,这个时候我们应该将刚才添加的用户显示到列表页,所以在加载列表页的时候我们应该跳转并刷新界面。还是少说费话,代码见……

    editmsg.wxml页面

    <view wx:for="{{msg}}" wx:key="{{index}}">
        {{item}}
    </view>
    <button class="btn" bindtap="handleGoToMsg">编辑</button>
    

    editmsg.js

    Page({
        data: {
            msg: ['今天天气很好']
        },
        handleGoToMsg(e){
            console.log(e)
            wx.navigateTo({
                url: '/pages/msg/msg',
            })
        }
    })
    

    msg.wxml页面

    <form bindsubmit="handelSubmitMsg">
        <textarea name="con" placeholder="请输入信息" placeholder-style="color: red;"></textarea>
        <button form-type="submit" class="btn">提交</button>
    </form>
    

    msg.js

    // pages/msg/msg.js
    Page({
        // 点击提交按钮
        handelSubmitMsg(e){
            // 获取添加的内容
            const { con } = e.detail.value
           
            // 获取当前页面的数据
            let page = getCurrentPages()[0]
            // console.log(page)
    
            // 获取msg数组
            let msg = page.data.msg
            // console.log(msg)
    
            msg.push(con)
            // console.log(msg)
    
            // 这里修改数据不能用this,因为this指向的msg页面的Page对象,而我们修改的数据是当前页面中的page对象下的.data数据
            page.setData({
                msg
            })
            
            // 返回上一页
            wx.navigateBack({})
        }
    })
    

    相关文章

      网友评论

          本文标题:关于微信小程序页面跳转后如何刷新当前页面:

          本文链接:https://www.haomeiwen.com/subject/cjarzctx.html