小程序列表跳转至详情_小程序跳转链接怎么获取

小程序列表跳转至详情_小程序跳转链接怎么获取效果展示:列表页js部分:onLoad:function(options){varthat=this;wx.request({url:’你的接口’,data:{ 接口参数},header:{‘content-type’:’ap…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

2020/9/1:这种写法能实现但是用了多次缓存,后面发现其实是可以用自定义属性来传参的,具体有空我会写出来

效果展示:

小程序列表跳转至详情_小程序跳转链接怎么获取

小程序列表跳转至详情_小程序跳转链接怎么获取

 

列表页js部分:

onLoad: function(options) {

    var that = this;

    wx.request({

      url: ‘你的接口’,

      data: {

          接口参数

      },

      header: {

          ‘content-type’: ‘application/json’, // 默认值

      },

      success: function (res) {

          console.log(res.data);

          that.setData({

            你定义的变量名: res.data,

          })

      }

    })

  },

跳转详情页方法

 viewDetail: function(e) {

    let newsid = e.currentTarget.dataset.id || ”;

    let newsTitle = e.currentTarget.dataset.newstitle || ”;

    let newsAuthor = e.currentTarget.dataset.newsauthor || ”;

    let newsDescription = e.currentTarget.dataset.newsdescription || ”;

    let newsCreateTime = e.currentTarget.dataset.newscreatetime || ”;

    let newsContentText = e.currentTarget.dataset.newscontenttext || ”;

    let newsInfoSource = e.currentTarget.dataset.newsinfosource || ”;//你想传递的值

    //放入缓存

    wx.setStorage({

      key: ‘你定义key的名程’,

      data: {

        newsid,

        newsAuthor,

        newsTitle,

        newsDescription,

        newsCreateTime,

        newsContentText,

        newsInfoSource

      },

      success: function () {

        wx.navigateTo({

          url: ‘../news_home/Detail/Detail?newsid=’  + newsid + “&newsTitle” + newsTitle + “&newsAuthor” + newsAuthor

          + “&newsDescription” + newsDescription + “&newsCreateTime” + newsCreateTime + “&newsContentText” + newsContentText

          + “&newsInfoSource” + newsInfoSource

        })

      }

    })

  },

 

列表页wxml:

用data-绑定传递

 <view class=” bindtap=’viewDetail’ data-newsid='{
{item.newsid}}’ data-newstitle='{
{item.Title}}’ data-newsauthor='{
{item.Author}}’ data-newsdescription='{
{item.Description}}’ data-newscreatetime='{
{item.CreateTime}}’ data-newscontenttext='{
{item.ContentText}}’ data-newsinfosource='{
{item.InfoSource}}’>

                <view style=”width:100%”>标题:{
{item.Title}}</view>

                <view style=”width:100%”>作者:{
{item.Author}}</view>

                <view style=”width:100%”>发布时间:{
{item.CreateTime}}</view>

          </view>

 

详情页js:

从缓存中拿取数据

onShow: function () {

    let that = this;

    // 从缓存中获取

    wx.getStorage({

      key: ‘你定义key的名字’,

      success: function (res) {

        that.setData({

          newsTitle: res.data.newsTitle,

          newsAuthor:res.data.newsAuthor,

          newsDescription:res.data.newsDescription,

          newsCreateTime:res.data.newsCreateTime,

          newsContentText:res.data.newsContentText,

          newsInfoSource:res.data.newsInfoSource

        })

      },

    })

  },

 

详情页xwml:

      <view>{
{newsInfoSource}}</view>

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/171094.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 轻量级MVVM框架Stylet介绍:(3)关于Bootstrapper「建议收藏」

    轻量级MVVM框架Stylet介绍:(3)关于Bootstrapper「建议收藏」Bootstrapper负责引导应用程序,用于配置IoC容器,创建根ViewModel的新实例,并使用显示WindowManager出来。它还提供了各种其他功能,如下所述。引导程序有两种风格

    2022年7月4日
    35
  • mysql字符串和数字的互相转换

    mysql字符串和数字的互相转换1.最简单的方式就是直接在字符串后面+0,就相当于直接把字符串转为数字类型了,下面可以看一下具体的操作,可以看到通过+0操作,成功将两个字符串转化为了数字,并得到了相加后的结果。2.使用CAST()函数,使用方式为CAST(valueAStype);,下面可以看一下具体的操作例子,通过如下sql语句查看结果:SELECTCAST(‘5.45’ASSIGNED);…

    2022年5月30日
    52
  • js数组拼接的四种方法[通俗易懂]

    js数组拼接的四种方法[通俗易懂]vara=[1,2,3,4,5,6];varb=[&quot;foo&quot;,&quot;bar&quot;,&quot;fun&quot;];最终的结果是:[1,2,3,4,5,6,&quot;foo&quot;,&quot;bar&quot;,&quot;fun&quot;]方法1:concatc=a.concat(b);c是新数组,此时内存使用有,c,a,b三个数组。方法2:

    2022年6月14日
    38
  • visio 2013安装教程

    visio 2013安装教程最近学习过程中要用到绘图工具 想来还是 visio 好用 以前用的是 2007 版本太低了 不好用 网上找了 2013 安装教程 这里分享给大家 百度网盘链接 https pan baidu com s 1U KaQ87cEfODzM 密码 r5u2 里边有安装教程 版本是 visio 位的

    2025年10月16日
    3
  • ftp扫描软件下载_哪国最爱运动

    ftp扫描软件下载_哪国最爱运动不知道大家用过哪几种ftp扫描工具,是不是感觉都是大同小异的呢?其实市面上的ftp扫描工具功能都是差不多的,当然也还是有一点差别的,那一点的差别可能就是我们选择那一种ftp扫描工具的原因。不论怎么说,也都是要选择自己喜欢的ftp扫描工具来使用。第一款:IIS7服务器管理工具这款工具里面的ftp扫描工具体验感是比较好的,除了一般ftp扫描工具里面都有的批量管理,它还有很多自己设计的功能。可以说这就是它成功的关键。它还能够进行定时上传下载、定时备份和多任务同时进行。哦对,它还有自动更新的功能。IIS7服务

    2022年10月1日
    2
  • mysql主从复制原理_MySQL主从同步

    mysql主从复制原理_MySQL主从同步 mysql是现在普遍使用的数据库,但是如果宕机了必然会造成数据丢失。为了保证mysql数据库的可靠性。就要会一些提高可靠性的技术。主从复制原理如下。slave(从服务器)master(主服务器)mysql主从是异步复制过程master开启bin-log功能,日志文件用于记录数据库的读写增删需要开启3个线程,masterIO线程,slave开启IO线程SQL线程,…

    2022年8月13日
    10

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号