微信小程序---查看更多的显示与隐藏
平时工作中经常遇到开始只显示几行文字,点击按钮,可以查看全部文字内容。
简单写了个,代码如下:
<view class="item_content f28 gray">
<view class="{{isShow?'max3':''}}">
一个天津市公司,和公司1签了一份企业整体转让的协议,天津公司没有履行协议,故意不转让了。一个天津市公司,和公司1签了一份企业整体转让的协议,天津公司没有履行协议,故意不转让了。天津公司和我们另一个公司2有买卖天津公司和我们另一个公司2有买卖
</view>
<view class="flex_row more" bindtap="clickMore" hidden="{{!isShow}}">
<text class="iconfont icon-xiajiantou"></text>
<text>查看全部</text>
</view>
</view>
样式:
.item_content{padding:25rpx 25rpx;border-bottom: 1px solid #D4D4D4;}
.max3{display: -webkit-box;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;white-space: normal !important;-webkit-line-clamp:;-webkit-box-orient: vertical;}
.more{margin-top:15rpx;color:#CCCCCC;font-size: 28rpx;}
js
data: {
isShow:true,
},
clickMore:function(){
if (this.data.isShow){
this.setData({
isShow: false,
})
}
},
微信小程序---查看更多的显示与隐藏的更多相关文章
- 微信小程序中视频的显示与隐藏
在微信小程序中实现视频的播放与暂停 需求: 视频列表中只能有一个视频在播放 点击视频实现播放与暂停功能 加载完成显示图片,点击后变为视频播放 从上次播放的位置进行播放 思路: 定义一个标记变量,控制视 ...
- 【微信小程序】 wx:if 与 hidden(隐藏元素)区别
wx:if 与 hidden 都可以控制微信小程序中元素的显示与否. 区别: wx:if 是遇 true 显示,hidden 是遇 false 显示. wx:if 在隐藏的时候不渲染,而 hidden ...
- 转载:【微信小程序】 wx:if 与 hidden(隐藏元素)区别
条件渲染 顾名思义所谓的条件渲染,就是通过条件来判断是否需要渲染该代码块.条件渲染主要是用到wx:if 和 block wx:if 这两个,第一个相信好理解,第二个是在block里面进行条件渲染,这里 ...
- 微信小程序开发--背景图显示
这两天开发微信小程序,在设置背景图片时,发现在wxss里面设置 background-image:(url) 属性,不管是开发工具还是线上都无法显示.经过查资料发现,background-image ...
- 微信小程序列表项滑动显示删除按钮
微信小程序并没有提供列表控件,所以也没有iOS上惯用的列表项左滑删除的功能,SO只能自己干了. 原理很简单,用2个层,上面的层显示正常的内容,下面的层显示一个删除按钮,就是记录手指滑动的距离,动态的来 ...
- 【微信小程序】tabBar的显示问题
tabBar不显示 在app.json中配置了4个页面,在tabBar的list中随意写了两个页面,编译后发现不能显示tabBar. { "pages": [ "page ...
- 微信小程序open-data userAvatarUrl圆角显示
从年初开始,打开小程序,工具栏都会弹出这个提醒: 也就是,默认不弹出授权询问框,默认获取不到用户信息(头像.昵称等)! 如果你需要用到这个接口,可以尝试以下方法: 1.用 button 组件,将属性名 ...
- 微信小程序图片宽100%显示并且不变形
<view class="meiti" style="background-color:red;"> <image src="htt ...
- 微信小程序判断按钮是否显示,或者隐藏
js中: onLoad:function(options) { this.setData({ orderstate:'待送检' }) }, WXML中: <view wx:if=" ...
随机推荐
- FormCollection使用
FormCollection用来在controller中获取页面表单元素的数据.它是表单元素的集合,包括<input type="submit" />元素. 用法举例: ...
- 0002SpringBoot整合Junit
前提条件:SpringBoot已经整合了Mybatis,至于SpringBoot如何整合Mybatis可参考我的上一篇文章 SpringBoot为什么要整合Juni? SpringBoot整合了Jun ...
- Http协议与TCP协议
背景 在日常工作中,经常会遇到某某框架是基于Http协议或者TCP协议,今天,就针对于该协议,整理下 从本质上来说,Http协议与TCP协议是应用在不同网络层,Http协议处于应用层,TCP处于传输层 ...
- Nginx HTTP服务器配置模板
https://github.com/h5bp/server-configs-nginx
- 阿里云服务器(windows server 2012 r2 64位)安装MYSQL8.0.18数据库 (小白必备)
今儿中午询问了朋友关于服务器的一些事情后,就开始安装了,从中午大概一点,整到晚上九点,终于装成功了,感觉安装过程能遇到的问题全遇到了,给后面的朋友一些参考意见把. 第一次碰云服务器,措辞不当或不正确之 ...
- 5、组件注册-@Scope-设置组件作用域
5.组件注册-@Scope-设置组件作用域 IOC容器默认都是单实例的 /** * * {@link ConfigurableBeanFactory#SCOPE_SINGLETON SCOPE_SIN ...
- mouseout([[data],fn])
mouseout([[data],fn]) 概述 当鼠标指针从元素上移开时,发生 mouseout 事件. 该事件大多数时候会与 mouseover 事件一起使用.深圳dd马达 注释:与 mousel ...
- Apache 下载+安装
1.官网下载Apache 官网地址:https://httpd.apache.org/ 点击Download 上面那段话,大致意思:很高兴Apache服务器2.4.18版本的发布.在2.4.x的分支的 ...
- leetcode解题报告(2):Remove Duplicates from Sorted ArrayII
描述 Follow up for "Remove Duplicates": What if duplicates are allowed at most twice? For ex ...
- 一些特殊的矩阵快速幂 hdu5950 hdu3369 hdu 3483
思想启发来自, 罗博士的根据递推公式构造系数矩阵用于快速幂 对于矩阵乘法和矩阵快速幂就不多重复了,网上很多博客都有讲解.主要来学习一下系数矩阵的构造 一开始,最一般的矩阵快速幂,要斐波那契数列Fn=F ...