Vue.js
大陀螺
PHP/JS/SWIFT
展开
-
VUE Swiper设置loop模式,第二轮首图click失效
swiper vue中使用时,loop模式下点击事件无法触发bug对应方法原创 2022-06-08 10:10:31 · 1754 阅读 · 1 评论 -
IcoMoon双色字体图标换行时未完全显示
项目需要在一些用户名后面显示图标。最初直接用图片格式添加在文字后面,但在pc端和不同的手机端,图标位置忽上忽下,很难调,代码也显得杂乱。最终决定将mark制作成字体图标,用i标签来显示,以保证图标和字体位置一致。在需要加下划线的位置,也不用做任何特殊处理。参考了文章链接: link.自制字体图标,引入项目。位置的问题完美解决,但测试人员反映,在iOS端,有的图标显示有异常。正常是红色箭头所指,蓝色多边形内有一个白色勾,但绿色箭头所指处未显示白色勾。iOS端icon出现在一原创 2020-11-12 21:29:21 · 297 阅读 · 0 评论 -
Vue+CSS实现渐变 半透明遮盖文字 点击显示全文取消遮盖
1.目标效果2.实现思路默认指定列表最大高度,显示【显示全文】按钮,在显示全文前插入遮罩div。 点击显示全文后取消列表高度限制,隐藏【显示全文】按钮和遮罩div。3.实现代码html部分 <div class="notice_box"> <div> &l...原创 2020-01-23 15:07:13 · 2971 阅读 · 0 评论 -
Web页面Android安卓真机调试
如果是前端开发手机页面,通常会需要在手机运行本地代码,检查页面布局和显示,同时需要在chrome浏览器控制台进行调试。在这里记录一下安卓机web页面,手机运行,pc调试的操作方法。主要用到的是chrome的remote DevTools。主要步骤:一.运行本机代码的调试手机下载chrome浏览器; 在手机上的chrome浏览器访问本地代码(在url地址栏输入电脑ip+端口...原创 2019-12-27 13:56:41 · 2624 阅读 · 2 评论 -
Vue完成数据请求后内容超出显示省略号+显示查看全文按钮
需求:如下图,当Vue完成数据请求后,根据文章内容设置显示方式。10行以内的显示全文,不显示【查看全文】按钮;内容超过指定行数时,超出内容隐藏,末尾显示省略号并显示【查看全文】按钮。实现思路 在异步请求数据完成后,判断文章内容所在元素高度。根据元素高度控制元素class和按钮显示。实践//给文章内容元素设置ref ;绑定class样式hide_des...原创 2019-12-26 17:04:59 · 3321 阅读 · 0 评论 -
更新服务器的Vue代码后客户端样式崩坏
问题:原生app嵌套Vue写的web页面时,当app在使用过程中更新了服务器的前端代码,出现样式乱掉的情况。客户端清除缓存后可以解决,但一般用户并不知道需要清理缓存。解决:思路: 每次上传代码前build时生成不同的style.css的文件名,使得app每次重新加载服务器代码时,重新加载一次CSS文件。实践: 在vue.config.js文件中设置sty...原创 2019-12-26 16:00:03 · 270 阅读 · 0 评论 -
VUE+ElementUI dialog打开时禁止iOS端的body滚动
现象:在原生app中嵌套web页面时,时常会遇到由于系统不同带来的差异。此次引入ElementUI,使用其中的dialog组件时,明明默认dialog显示时,body不能滚动:安卓和pc下没毛病,但在iOS下lock-scroll无效,dialog背后的body依然可以滚动。解决方法:思路: 主要是在打开dialog时设置html的 ...原创 2019-12-26 14:55:32 · 2056 阅读 · 0 评论