随笔分类 - Web前端
摘要：此次封装的oss直传 使用的是官网Browser.js和layui结合封装的插件。调用方式相对来说简单快捷 1、html是一个上传按钮。这里注意一下两个id， id="upload-normal" ：上传按钮的id。 id="upload-normal-list"：上传完图片（文件）展示的地方 这两
阅读全文
摘要：微信小程序的本地缓存跟H5的localStorage非常类似，是前端的数据库，以下用三种异步函数来实现本地缓存值的获取。 第一种：es5标准：通过回调函数获取 //设置缓存值 wx.setStorageSync('flag', '123') //异步获取缓存 const flag = wx.getS
阅读全文
摘要：在使用layui的上传插件进行上传图片时，如果需要控制上传的图片的个数的时候，虽然文档提供了前置操作，但是并不能阻止上传操作，及时能控制，该上传文件已经添加到文件上传的队列中了（在此过程中，重新对该文件上传会有异常情况） 搜索百度很多都是修改layui插件的 纠结中... 后来，尝试在上传完成之后，
阅读全文
摘要：摘要：要实现全屏滚动，必须动态计算用户的屏幕高度； 遇到的问题： 1、设置宽高100%是无法撑开容器来获取高度； 2、可以用js获取屏幕高度，但是会浪费性能 可行方法： 将容器脱离文档流，设置position:absolute,然后设置宽高100%就可以了 标准的swiper结构，contain的高
阅读全文
摘要：现在在众多的应用中，项目性能是老生常谈的话题了，高性能的用户体验才能更好的吸引和留住用户，下面说说在小程序中的一些性能优化的方法： 1、控制项目包大小：小程序代码包大小不能超过2M，所以控制代码包大小尤为重要，减小项目代码包的措施有 1）.清理无用代码 2）.采用分包策略 3）.压缩图片，使用适当图
阅读全文
摘要：瀑布流的布局有好多种实现的方式，随着浏览器对css3的属性的支持，发现通过CSS3的多列（Multi-column）属性，可以简单的实现类似效果。 具体步骤： 1.设置外部容器多列列数（column-count）和列间距（column-gap） 2.设置内容条目的break-inside属性为avo
阅读全文
摘要：promise 可解决的问题： 可以支持多个并发的请求，获取并发请求返回的数据 解决回调地狱的问题 真正用同步代码写异步操作的是 async await Promise两个特点： 对象的状态不受外界影响 一旦状态改变，就不会再变，任何时候都可以得到这个结果 Promise三种状态： Pending（
阅读全文
摘要：当需要对不同的选项，切换不同的显示时（显示数据由后台接口返回） <select name="" id="program" lay-filter="filter"> <option value="0" info="json string1 or string1">请选择分类</option> <opt
阅读全文
摘要：问题出现场景： 一个活动中需要写一个倒计时的脚本，然后就用到Date.parse()这个方法，但是在IOS中无法获取到Date.parse()的值，提示NAN; 相关知识 格式化时间转换为时间戳的三种方法： var t1 = Date.parse(new Date()); var t2 = (new
阅读全文
摘要：最近做一个活动，需要前端生成截图，用到了html2canvas，但是其中有个致命的问题是，活动生成的图片中要求需要一个动态的二维码 最初的活动是固定的二维码，所以生成没有问题，动态的二维码涉及到跨域等问题，无法在生成的图片中呈现 于是想到了利用前端canvas方式方式构建一个二维码画布，html2c
阅读全文
摘要：问题情境： layui中将数据库数据通过layui table渲染到前端表格，非常简单，但是如果数据库存储的信息不能被直接展示，项目中该页面有好几个这样的字段，会员类型，支付类型，会员时长还有平台类型；例如数据库有一个类型字段：1和2,1表示钻石会员，2表示至尊会员，前端显然不能直接显示1和2，而是
阅读全文
摘要：项目中需要实现一个功能 根据搜索条件，表格展示不同内容的列，于是去试了一下 table.reload('tableId', { where:field,//搜索条件 cols:[closs]//给cols赋值 }); 没毛病，然而在完成后测试发现 一开始的表格是15列，切换后是17列，再切回的时候莫
阅读全文
摘要：cascader 无限级联选择器的使用 html代码 <div class="layui-form-item"> <label class="layui-form-label">市内线路:</label> <div class="layui-input-block" style='position:
阅读全文
摘要：开发微信小程序过程中运用到了map地图组件，官网文档写的比较简陋一些，好多核心功能没有详细说明，比如include-points，怎样做到类似滴滴那种将所有坐标点都展示在视野范围内呢； 1.如果不设置中心点latitude、longitude会有不能展现到视野内的问题；所以先要计算两点之间的中心点：
阅读全文
摘要：新的广告系统， 采用客户端直接上传到阿里云，阿里云异步调用服务器的模式（Browser.js） 参考地址：https://www.alibabacloud.com/help/zh/doc-detail/32069.htm?spm=a2c63.p38356.b99.702.5d66219fMXc1Ka
阅读全文
摘要：最近使用layui的表单组件，进行动态化渲染赋值操作，死活不成功，经过多次排查和尝试，总结了一下解决方法 1、单选框 对单选框进行动态赋值时发现单选框赋值无效果，此处有个特别的细节是，如果你设置是是数据型类型，传入int数据，将无法生效，必须改写为‘1’，‘0’ 这样的字符串方式方可生效 2、子页面
阅读全文
摘要：官方地址：https://fly.layui.com/extend/treeSelect/ 下面介绍一下这个插件的使用方法 1.html页面 <div class="layui-input-block"> <input name="pid" value="" type="text" id="tree
阅读全文
摘要：网上搜索了下，整理下移动端页面，需要注意的 控制显示区域各种属性： <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"> width - v
阅读全文
摘要：1.小程序组件map，在微信7.0.4以上（不包括7.0.4）层级问题官方已作更新，可在map上随意添加任何标签使用z-index即可；微信7.0.4版本以下map组件层级默认是最高的，只能使用官方提供的cover-view及cover-image可覆盖原生组件； 2.小程序map自定义个性化地图设
阅读全文
摘要：之前遇到一个问题，就是写了一个正常的移动端首页，底部是导航，上面的是内容，在安卓手机是页面滑动到底部的时候，不会再滑动的，但是问题就出现在ios手机中。页面正常布局是，导航是position：fixed，z-index：9，其他整体布局差不多是position：relative，z-index：1（
阅读全文
