微信小程序常用代码(1)——tab切换
<view class="font-bold tab-content">
<!-- 循环列表 -->
<block wx:for="{{jobList}}" wx:key="{{item.deptId}}">
<!-- 点击时会触发事件viewDeptTwo ,并且携带数据(data-id)-->
<!-- 当点击时候会触发函数,将标识符deptId转为item.deptId中的值,只有当标识符deptId==item.deptId时,才会显示on的样式 -->
<view wx:if="{{item.deptId==1}}" class="{{item.deptId==deptId?'on':''}}" data-id="{{item.deptId}} " bindtap="viewDeptTwo">
{{item.deptName}}
</view>
</block>
</view>
<!--当deptId为1时候显示当前的模板-->
JS页面中 data中的数据
data: {
jobList: [
{
deptId: ,
deptName: '院校实习'
},
{
deptId: ,
deptName: '兼职'
},
{
deptId: ,
deptName: '全职'
}
],
deptId:
},
JS页面中的函数
viewDeptTwo: function (e) {
this.setData({
deptId: e.currentTarget.dataset.id //当点击一个tab时,会触发此函数,
})
微信小程序常用代码(1)——tab切换的更多相关文章
- 解决微信小程序的wx-charts插件tab切换时的显示会出现位置移动问题-tab切换时,图表显示错乱-实现滑动tab
解决Echarts在微信小程序tab切换时的显示会出现位置移动问题 tab切换时,图表显示错乱 <canvas class="kcanvas" canvas-id=" ...
- 微信小程序的wx-charts插件-tab选项卡
微信小程序的wx-charts插件-tab选项卡 效果: //index.js var wxCharts = require('../../utils/wxcharts-min.js'); const ...
- 微信小程序常用样式汇总
本文系转载: 原文作者:chenzheng8975 原文地址:https://www.cnblogs.com/chenzheng8975/p/9605186.html 微信小程序常用样式汇总 小程序特 ...
- 微信小程序关于tabbar点击切换数据不刷新问题
微信小程序中经常遇到的需求就是我提交了一个表单或者进行了一个操作,需要在我的个人中心页面中实时显示出来,但是小程序中的tabbar切换类似于tab切换 并不会进行页面刷新请求 所以总是会造成一些数据更 ...
- 微信小程序实例代码
http://blog.csdn.net/zuoliangzhu/article/details/53862576#t1 项目结构 └─ empty-folder/ ················· ...
- 微信小程序常用控件汇总
1.图片标签: <image src="/images/aaa.png"></image> 2.文本标签: <text>Hello</te ...
- 微信小程序常用API组件开发
关于小程序 张小龙定义小程序: 1.不需要下载安装即可使用: 2.用完即走,不用关心是否安装太多应用: 3.应用无处不在,随时可用. 特点: 1.适合业务逻辑简单的应用: 2,.适合低频应用: 3.适 ...
- 微信小程序 原生代码 转wepy 字符串处理
import globimport os cwd = os.getcwd()sep = os.septarget = cwd + sep + 'pages' + sep + '*' + sep + ' ...
- 微信小程序——常用快捷键【四】
格式调整 ctrl+[, ctrl+]:代码行缩进(向前|向后) ctrl+shift+[, ctrl+shift+] :折叠打开代码块 ctrl+C, ctrl+V:复制粘贴,如果没有选中任何文件则 ...
随机推荐
- NirSoft 实用程序
64-bit (x64) utilities package 此软件包包含NirSoft中的所有实用程序,这些实用程序具有64位版本(x64)Windows的独立构建. 此程序包包含下面列表中每个实用 ...
- 实验吧-web-Guess Next Session(session简介)
看代码: <?php session_start(); if (isset ($_GET['password'])) { if ($_GET['password'] == $_SESSION[' ...
- P1085 PAT单位排行
转跳点:
- 统计返回的Decimal/long型数据转换问题
mysql数据库在进行统计时候,返回的count()是个long型,sum()返回的是bigDecimal类型,前段需要的是int型故而需要进行转换. <select id="getD ...
- 采用idea创建springboot mybatis web工程
idea是一款强大的利器,最近公司换成采用springboot在eclipse上开发,因为idea的强大,故而,学习一下该利器,搭建springboot的web工程,在下面练习使用. 一.创建spri ...
- 安装redis cluster时:undefined method `invoke_with_build_args' for nil:NilClass
gem install -l redis-3.3.3.gem ERROR: Loading command: install (LoadError) cannot load such file -- ...
- Spring Boot2(005):关于代码结构
spring boot 对于工程代码结构并没有特殊得要求,但以下几个有用的最佳实践建议参考参考: 1.不鼓励而且应该避免使用 default 包 没有 package 声明的类被认为是在 defaul ...
- mcu运行时间估算
昨个伙计问我他那个板子的程序运行时间估算问题… 现在说一下估算的思路.首先确定有几个点,板子的主频.时钟周期,机器周期. 首先由主频f得到一个时钟周期为1/f. 再者时钟周期与机器周期有一个比例关系, ...
- Vulkan SDK 之Render Pass
Create a Render Pass A render pass describes the scope of a rendering operation by specifying the co ...
- 039-PHP使用闭包函数来进行父实例的变量自增,错误示例
<?php // 如何使用闭包函数来进行父实例的变量自增,错误示例 function demo(){ $num = 1; $func = function() use($num){ echo $ ...