<!-- 1分类菜单-->
<view class='edition-menu flex'>
<block wx:key="edmenu" wx:for="{{edmenu}}" wx:for-index="index">
<view class='flexcca' data-index='{{index}}' bindtap='keyMenu'>
<text class="menu-title {{item.active?'actitle':''}}">{{item.menunm}}</text>
<view class="menu-under {{item.active?'edactive':''}}"></view>
</view>
</block>
</view>
<!-- 2详情列表 -->
<view class='edition-detail'>
<view wx:if="{{edmenu[0].active?true:''}}" class='detail-item-box'>
<block wx:key="edlist0" wx:for="{{edlist0}}">
<view class='detail-item flex'>
<view class='item-pic'>
<image class='image-full' src='../../../imgs/user/useradd.png'></image>
</view>
<view class='item-text'>
<view>
<text>需求编号:2133124312523</text>
</view>
<view>
<text>采购数量:88米</text>
</view>
<view class='flexb'>
<text>品名:欧根纱</text>
<text style='color:#999;font-size:24rpx;'>2017-01-28</text>
</view>
</view>
</view>
<view class='detail-result flexba'>
<text></text>
<text>待审核</text>
</view>
</block>
</view>
<view wx:if="{{edmenu[1].active?true:''}}">
</view>
<view wx:if="{{edmenu[2].active?true:''}}">
</view>
</view>
//-------------------------------------------------------------
.edition-container{
font-size: 30rpx;
color: #333;
}
/* 1分类菜单 */
.edition-menu{
height: 80rpx;
border-top: 1px solid #f7f7f7;
border-bottom: 1px solid #f7f7f7;
box-sizing: border-box;
">#fff;
color: #666;
}
.edition-menu>view{
width: 33.33%;
}
.edition-menu .menu-title{
margin-top: 15rpx;
}
.edition-menu .menu-under{
width: 70rpx;
height: 5rpx;
">transparent ;
border-radius: 6rpx;
margin-top: 10rpx;
}
.edition-menu .actitle{
color: #839AAF;
}
.edition-menu .edactive{
">#839AAF;
}
/* 2详情列表 */
.detail-item{
/* height: 314rpx; */
">#fff;
padding:20rpx 24rpx;
}
.edition-detail .item-pic{
width: 160rpx;
height: 184rpx;
margin-right: 20rpx;
overflow: hidden;
}
.edition-detail .item-text{
font-size: 26rpx;
flex:1;
line-height:62rpx;
}
.edition-detail .detail-result{
height: 90rpx;
border-top: 1rpx solid #f7f7f7;
">#fff;
padding: 0 24rpx;
box-sizing: border-box;
color: #839AAF;
font-size: 26rpx;
}
//-------------------------------------------------
edmenu:[
{menunm:'待审核',active:true},
{ menunm: '审核未通过', active: false },
{ menunm: '审核通过', active: false }
],
edlist0: [
{ name: '欧根纱', regid: "34289734897", num: '66', date:'2017-01-28'}
],
edlist1: [],
edlist2: [],

// 焦点控制函数
keyMenu: function (e) {
var edmenu = this.data.edmenu;
var index = e.currentTarget.dataset.index
for (var i = 0; i < edmenu.length;i++){
edmenu[i].active=false;
}
edmenu[index].active = true;
this.setData({
edmenu: edmenu
})
},

转载于:https://www.cnblogs.com/dianzan/p/7715914.html

微信 小程序组件 分页传参相关推荐

  1. 微信小程序组件的传参

    # 父子关系 1.父向子传参 // 子组件:通过 properties 声明要从父组件中接收的数据 //    组件的属性列表 properties:{ tabId:String } // 父组件:通 ...

  2. uni-app 微信小程序 分享功能 传参 接收 与 调试

    uni-app 微信小程序 功能 传参 接收 与 调试 当使用微信小程序进行分享好友功能时,怎样能够联调,查看是否接收到参数,并在被分享人点进来的时候逻辑处理是否正确. 1.分享功能实现 分享给朋友 ...

  3. 原生微信小程序跳转传参 : [非TabBar跳转传参] 和 [TabBar跳转传参]

    一般常用的微信小程序跳转分为两种 1.非TabBar跳转 2.TabBar跳转 1.非TabBar跳转 非TabBar页面的跳转通常使用wx.navigateTo来跳转页面,在链接后面加 ? 传参,如 ...

  4. 微信小程序uni.switchTab传参获取不到;小程序跳转到tabBar页并传参;uni-app微信小程序获取tabBar页面参数失败;uni-app微信小程序tabBar页面onLoad不执行

    需求场景:从非tabBar页面B跳转到tabBar页面A,并想要携带参数. 如果使用uni.switchTab传参,会导致tabBAE页面获取不到参数: 原因: 官方文档有说,uni.switchTa ...

  5. 微信小程序使用formdata传参上传图片

    先看下接口  方法: 需要自己写formdata,因为小程序中不支持formdata传参 建立一个formdata文件夹,以及两个子文件  index.js import mimeMap from ' ...

  6. 微信小程序分享路径传参的问题

    最近在开发一个类似于小年糕的视频工具类的小程序,在写分享功能的时候需要实现以下两种场景 1. 当点击某个视频分享出去时,好友打开到视频详情页播放视频,返回时跳到首页. 2. 当在用户主页点击分享时,好 ...

  7. 微信小程序---双向绑定传参

    1.双向绑定 1.1html <view class="text"><textarea placeholder=" 来呀,写下你的心情" va ...

  8. 微信小程序的事件传参

    1. 什么是事件委托     将子元素的事件委托(绑定)给父元素 2. 事件委托的好处(ul 下面的100li需要添加事件,可以直接绑定再父元素上)    1. 减少绑定的次数    2. 后期新添加 ...

  9. 微信小程序跳转传参的方法

    目的: 带着第一个页面的id,传到第二个页面,实现同一个页面,点击不同商品显示对应的数据 首先在第一个页面的js文件中写好接口 Page({data: {content:"",}, ...

最新文章

  1. 【matlab】第二章基本使用方法
  2. Struts2——学习(5):页面跳转
  3. Terraform入门 - 3. 变更基础设施
  4. LAS点云查看 转换格式
  5. 14种常见HTTP状态码
  6. linux 内核源代码漫游,Linux内核源代码漫游——
  7. IP地址与子网掩码总结
  8. 网络4/7层模型各层作用和协议对比
  9. windowskb2685811补丁_KB898461补丁
  10. Shiro————会话管理
  11. 单进程服务器(python版)
  12. this与$(this)的区别
  13. java string简单例子_java从字符串中提取数字的简单实例
  14. 【模式识别】信号检测实验及MATLAB仿真
  15. 腾讯云服务器价格明细表(CPU内存/带宽/磁盘)
  16. 2019 ngChina 开发者大会 - 工作坊系列:RxJS,Angular,和全栈开发
  17. 增强现实技术(AR)的103个应用场景汇总
  18. 备战数学建模33-灰色预测模型2
  19. Python制作词云视频,通过词云图来看小姐姐跳舞
  20. 手机被DNS劫持后的更改方案

热门文章

  1. Spring创建Bean的3种方式
  2. Linux 环境下vs2015 qt,QT5.8.0+MSVC2015安装以及环境配置(不需要安装VS2015)
  3. c语言稀疏矩阵做除法,稀疏矩阵的除法
  4. php 文字图片怎么保存为图片,php技术实现加载字体并保存成图片
  5. 如何为云原生应用带来稳定高效的部署能力?
  6. 云原生时代, Kubernetes 多集群架构初探
  7. 第二章matlab数据及其运算,第2章 MATLAB数据及其运算_习题答案
  8. dao传递类参数 mybatis_MyBatis DAO层传递参数到mapping.xml 几种方式
  9. hive mysql 远程_Hive配置 远程连接MySQL
  10. 如何在graphpad表示出正负误差_GraphPad Prism 8.0绘制误差连线并填充颜色图