平时工作中经常遇到开始只显示几行文字,点击按钮,可以查看全部文字内容。

简单写了个,代码如下:

  1. <view class="item_content f28 gray">
  2. <view class="{{isShow?'max3':''}}">
  3. 一个天津市公司,和公司1签了一份企业整体转让的协议,天津公司没有履行协议,故意不转让了。一个天津市公司,和公司1签了一份企业整体转让的协议,天津公司没有履行协议,故意不转让了。天津公司和我们另一个公司2有买卖天津公司和我们另一个公司2有买卖
  4. </view>
  5. <view class="flex_row more" bindtap="clickMore" hidden="{{!isShow}}">
  6. <text class="iconfont icon-xiajiantou"></text>
  7. <text>查看全部</text>
  8. </view>
  9. </view>

样式:

  1. .item_content{padding:25rpx 25rpx;border-bottom: 1px solid #D4D4D4;}
  2. .max3{display: -webkit-box;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;white-space: normal !important;-webkit-line-clamp:;-webkit-box-orient: vertical;}
  3. .more{margin-top:15rpx;color:#CCCCCC;font-size: 28rpx;}

js

  1. data: {
  2. isShow:true,
  3. },
  4.  
  5. clickMore:function(){
  6. if (this.data.isShow){
  7. this.setData({
  8. isShow: false,
  9. })
  10. }
  11. },

微信小程序---查看更多的显示与隐藏的更多相关文章

  1. 微信小程序中视频的显示与隐藏

    在微信小程序中实现视频的播放与暂停 需求: 视频列表中只能有一个视频在播放 点击视频实现播放与暂停功能 加载完成显示图片,点击后变为视频播放 从上次播放的位置进行播放 思路: 定义一个标记变量,控制视 ...

  2. 【微信小程序】 wx:if 与 hidden(隐藏元素)区别

    wx:if 与 hidden 都可以控制微信小程序中元素的显示与否. 区别: wx:if 是遇 true 显示,hidden 是遇 false 显示. wx:if 在隐藏的时候不渲染,而 hidden ...

  3. 转载:【微信小程序】 wx:if 与 hidden(隐藏元素)区别

    条件渲染 顾名思义所谓的条件渲染,就是通过条件来判断是否需要渲染该代码块.条件渲染主要是用到wx:if 和 block wx:if 这两个,第一个相信好理解,第二个是在block里面进行条件渲染,这里 ...

  4. 微信小程序开发--背景图显示

    这两天开发微信小程序,在设置背景图片时,发现在wxss里面设置 background-image:(url) 属性,不管是开发工具还是线上都无法显示.经过查资料发现,background-image ...

  5. 微信小程序列表项滑动显示删除按钮

    微信小程序并没有提供列表控件,所以也没有iOS上惯用的列表项左滑删除的功能,SO只能自己干了. 原理很简单,用2个层,上面的层显示正常的内容,下面的层显示一个删除按钮,就是记录手指滑动的距离,动态的来 ...

  6. 【微信小程序】tabBar的显示问题

    tabBar不显示 在app.json中配置了4个页面,在tabBar的list中随意写了两个页面,编译后发现不能显示tabBar. { "pages": [ "page ...

  7. 微信小程序open-data userAvatarUrl圆角显示

    从年初开始,打开小程序,工具栏都会弹出这个提醒: 也就是,默认不弹出授权询问框,默认获取不到用户信息(头像.昵称等)! 如果你需要用到这个接口,可以尝试以下方法: 1.用 button 组件,将属性名 ...

  8. 微信小程序图片宽100%显示并且不变形

    <view class="meiti" style="background-color:red;"> <image src="htt ...

  9. 微信小程序判断按钮是否显示,或者隐藏

    js中: onLoad:function(options) { this.setData({ orderstate:'待送检' }) },   WXML中: <view wx:if=" ...

随机推荐

  1. ggplot2入门与进阶(下)

    出处:http://www.cellyse.com/how_to_use_gggplot2_part2/ 更多实战 例一 Michaelis-Menten动力学方程 这个例子中采用出自文献中的一组有关 ...

  2. python 打印 str 字符串的实际内容 repr(str)

    python 打印 str 字符串的实际内容 repr(str) s = 'aa' print(repr(s))

  3. Nginx HTTP服务器配置模板

    https://github.com/h5bp/server-configs-nginx

  4. lvs+keepalived做高可用方案1

    本文我们主要讲解的是LVS通过keepalived来实现负载均衡和高可用,而不是我们第三篇文章介绍的通过手动的方式来进行配置.通过脚本的方式来显示RS节点的健康检查和LVS的故障切换.此文会通过一个实 ...

  5. c#动态调用WEBSERVICE接口

    C#动态webservice调用接口 1 using System; 2 using System.Collections; 3 using System.IO; 4 using System.Net ...

  6. ACM-ICPC 2018 沈阳赛区现场赛 E. The Kouga Ninja Scrolls (切比雪夫距离+线段树)

    题目链接: 题意:在二维平面上有 n 个人,每个人有一个位置(xi, yi)和门派 ci,m 个操作:①改变第 k 个人的位置:②改变第 k 个人的门派:③询问区间[l,r]之间不同门派的两个人的最大 ...

  7. C# 得到本周的第一天和最后一天

    1.得到本周的第一天和最后一天 /// <summary> /// 得到本周第一天(以星期一为第一天) /// </summary> /// <param name=&q ...

  8. 2019ICPC区域赛(银川)总结

    2019ICPC银川 作为第一次打区域赛的我,心情异常激动,加上学校给坐飞机(事实上赶飞机很痛苦). 热身赛很难受,oj上不去,写AC自动机输入没写好.. 现场赛,开场直觉倒着看,发现签到.然后看B, ...

  9. scapy2 爬取全站,以及使用post请求

    前情提要: 一:scrapy 爬取妹子网 全站  知识点: scrapy回调函数的使用 二: scrapy的各个组件之间的关系解析 Scrapy 框架 Scrapy是用纯Python实现一个为了爬取网 ...

  10. 洛谷P1860 新魔法药水

    洛谷题目链接 动态规划: 这个题目调了我好久....结果循环变量写错了... 而且题目有个坑!!!只能用开始给你的$v$元买入东西 回归正题: 我们定义状态$ans[i][j]$表示第$i$个物品用了 ...