微信小程序，通过获取新闻id进行页面传值详解必看

一共需要四个页面，我这里分别是，home.wxml，home.js，detail.wxml，detail.js这四个页面

通过点击home.wxml页面里的某条新闻进入detail.wxml页面查看详情……

home.wxml页面代码：
(说明：通过绑定catchtap="toDetail"方法，进行js页面新闻详情的跳转，我的后台数据的新闻Id是：article_id，这里的data-homeid=’{ {item.article_id}}'是相当于把后面{ {item.article_id}}赋值给了homeid)

<view class="content" wx:for="{
     {home}}" wx:key="key" catchtap="toDetail" data-homeid='{
     {item.article_id}}'>
    <!-- <navigator url="/pages/detail/detail"> -->
     <view class="left">
        <image src="http://www.wuye.com{
     {item.thumb_img}}"></image>
      </view>
     <view class="right">
       <text class="title">{
     {
     item.title}}</text>
       <text class="content2">{
     {
     item.content}}</text>
      </view>
    <!-- </navigator> -->
  </view>

home.js页面代码：

// pages/home/home.js
// http://www.xxx.com/admin/article
var app = getApp()
Page({
     

   //跳转到详情
   toDetail: function(e){
     
    // console.log(e)
    let homeId = e.currentTarget.dataset.homeid
    wx.navigateTo({
     
      url: '../detail/detail?homeId='+homeId,
    })
  },


  /**
   * 页面的初始数据
   * 
   * 生命周期函数--监听页面加载
   */
   // 后台接口数据渲染到页面js部分
  data: {
     
    home:[]
  },
  onLoad:function(options){
     
    var that = this
    wx.request({
     
      url: 'http://www.xxx.com/front/art',
      method:"GET",
      success(res){
     
        console.log(res)
        that.setData({
     
          home:res.data.data
        })
      }
    })
  }
})

detail.wxml页面代码：

<!--pages/detaile/detaile.wxml-->
<view class="detaile" wx:for="{
     {detail}}" wx:key="key">
  <!--添加判断条件-->
  <view wx:if="{
     {homeId==item.article_id}}">
    <view class="title">
      {
     {
     item.title}}
    </view>
    <view class="other">
      <view class="author">
        作者：<span>{
     {
     item.author}}</span>
      </view>
      <view class="time">
        发布时间：<span>{
     {
     item.pubdate}}</span>
      </view>
    </view>
    <view class="content">{
     {
     item.content}}</view>
  </view>
</view>

detail.js页面代码：

// pages/detaile/detaile.js
// http://www.xxx.com/admin/article
var app = getApp()
// var time = require('../../aaa.js')



Page({
     

  /**
   * 页面的初始数据
   * 
   * 生命周期函数--监听页面加载
   */
  data: {
     
    detail:[],
  },
  onLoad:function(options){
     
    // 接收新闻Id的页面js部分
    this.setData({
     
      homeId:options.homeId
    })
    // 数据渲染到页面js部分
    var that = this
    wx.request({
     
      url: 'http://www.xxx.com/front/art',
      method:"GET",
      success(res){
     
        // console.log(res)
        that.setData({
     
          detail:res.data.data
        })
      }
    })
  }
})

以上文章属于本人原创，转载请注明出处……