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

小程序列表跳转至详情_小程序跳转链接怎么获取效果展示:列表页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)
上一篇 2022年8月18日 下午10:36
下一篇 2022年8月18日 下午10:36


相关推荐

  • Cpu流水线_cpu多级流水线

    Cpu流水线_cpu多级流水线原文地址:AJourneyThroughtheCPUPipeline转载翻译地址:CPU流水线的探秘之旅作为程序员,CPU在我们的工作中扮演了核心角色,因此了解处理器内部的工作方式对程序员来说不无裨益。CPU是如何工作的呢?一条指令执行需要多长时间?当我们讨论某个新款处理器拥有12级流水线还是18级流水线,甚至是更深的31级流水线时,这到些都意味着什么呢?应用程序通常会将CPU看

    2022年8月20日
    12
  • JS全局变量和局部变量

    JS全局变量和局部变量全局变量和局部变量在看了一个博主写的关于js全局变量的的介绍后,自己也跟着做了一下,并且记录在这里。原博客地址:谈谈JS的全局变量跟局部变量。博主说的比较详细,也比我的表达好,如果不是没耐心,建议去看看原博主的文章先上一段代码:<scripttype=”text/javascript”>vara=1;functiontest(){ alert(a); a=4; aler

    2022年5月26日
    36
  • css3全屏背景图片切换特效

    效果体验:http://hovertree.com/texiao/css3/10/一般做图片切换效果,都会使用JS或者jQuery脚本,今天发现,其实只用CSS也可以实现。试试效果吧。效果图:代码

    2021年12月22日
    51
  • 常用Java编程软件有哪些[通俗易懂]

    常用Java编程软件有哪些[通俗易懂]很多想学Java的人想知道常用的Java编程软件有哪些,毕竟只有掌握软件才能更好的工作。然而,只掌握软件工具并不够,你还需要具备一定的知识基础,更要熟练掌握各个软件的应用,常用的Java编程软件有哪些?1、IntelliJIDEAIntelliJIDEA是java编程语言开发的集成环境。IntelliJ在业界被公认为最好的java开发工具之一,尤其在智能代码助手、代码自动提示、重构、J2EE支持、各类版本工具(git、svn等)、JUnit、CVS整合、代码分析、创新的GUI设计等方面的功能可以说

    2022年7月7日
    50
  • 2011年1月31日nod32id,nod32免费激活码_NOD32用户名密码

    2011年1月31日nod32id,nod32免费激活码_NOD32用户名密码
    用户名:EAV-40746393密码:f77rk82e7n(适用类型ESS/EAV)

    用户名:EAV-40746397密码:uj7javkt8c(适用类型ESS/EAV)

    用户名:EAV-40899369密码:bsfrudfene(适用类型ESS/EAV)

    用户名:EAV-40898530密码:mpju75r5u7(适用类型ESS/EAV)

    用户名:EAV-40746391密码:aj7urdnr6

    2022年6月16日
    58
  • Windows安装gitlab_Windows7

    Windows安装gitlab_Windows7文章目录一、下载指引二、安装说明三、配置信息一、下载指引在Windows上使用Git,可以从Git官网https://git-scm.com/直接下载安装程序,然后按默认选项安装即可。StandaloneInstaller:安装版,安装完之后会自动在鼠标右键时显示GitGUIHere和GitBashHere(推荐)Portable(“thumbdriveedition”):绿色版,解压就能运行,免安装,不过绿色版不会在鼠标右键时显示GitGUIHere和Gi

    2025年10月7日
    4

发表回复

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

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