收藏
回答

列表渲染+模板 绑定两组数据

问题模块
API和组件


我想实现上图这种功能,点击不同的年份按钮,在其下方显示相应内容,其他按钮下的内容自动隐藏。

我现在的思路是这样的:

Page({

  data: {

    riqi:[

      "2015",

      "2016",

      "2017"

    ],

    isshow:[],

  },

  onLoad: function () {

    var that=this

    var arr1=that.data.riqi

    var arr2=that.data.isshow

    for(var i =0;i<arr1.length;i++){

      arr2[i]=false

    }

    that.setData({

      isshow:arr2

    })

  },

  showjl:function(e){

    var id = e.currentTarget.dataset.id

    console.log(id)

    var that=this

    var arr1=that.data.isshow

    for(var i=0;i<arr1.length;i++){

      arr1[i]=false

    }

    arr1[id]=true

    that.setData({

      isshow:arr1

    })

    console.log(that.data.isshow)

  },

})

DATA中两个数组,一个riqi记录按钮的数量和显示内容,一个isshow控制按钮下的内容是否显示。

<block wx:for="{{riqi}}" wx:key="index">

  <template is="temp-sj" data="{{item}}" />

</block>


<template name="temp-sj">

  <button data-id="{{index}}" bindtap="showjl">{{item}}</button>

  <view wx:if="{{isshow}}">

    9999999999

  </view>

</template>

目前我这种方法肯定是不行的data-id="{{index}}"这个根本就没有数据,换成data-id="{{item}}",并修改JS文件倒是可以,但<view wx:if="{{isshow}}">也不行,<view wx:if="{{isshow[item]}}">也不行

最后一次编辑于  2017-06-24  (未经腾讯允许,不得转载)
邀请回答
复制链接收藏投诉关注问题回答