阿乐的博客

不管什么网站 直接在 html 文件中加上这个样式 就直接 灰了 这边记录一下。

特效 enter 按钮 闪烁

这种样式 可能在 一些 网站上看到过 相当于 给网站体验评个分 大家 可能都用过这个 就是不知道 有没有 注意过。实现一个评价 选择 弹框样式的选择。大家可以详细看看代码。

这是 给 每一个问题添加了一个点击事件。

这样可以当做一个字典 来使用 每次 点击 键盘上的字母或数字 就可以获得 keyCode。这个 在实际应用中还是有可能使到的 所以大家可以练习一下。

获取一个joke 放到页面上。前端调接口 原生调用。

主要是考验的是 当前 生成 元素的语法 以及 audio 标签的使用 相关的播放 暂停的 方法。这是生成了不同的按钮 进行显示。点击按钮 会播放对应的音频。每一个按钮对应一个音频。

一个这样的首页 滑动显示。

步骤progress

这个是重点代码 需要 点击事件 如果小伙伴 经常不写js 代码 可能就不会写了 再复习一下把。想做这样 一个效果 点击图片切换 当前的选中图片。我们使用 原生的js html 来开发这个。大家可以体验一下 看一下详细代码。相信大家 都能看懂的。

首先要找到一张图片，为了成功率较高，一定要是。

以上是 image-swiper 组件。

netWork 访问

创建primitive元素

3D模型添加与设置

我们经常会看到 市面上的一些小程序 当点击到 一些涉及到 用户信息的功能或者页面的时候 我们跳转到登录页面 当用户登录成功以后 再给用户返回到原来浏览的页面，这样的交互是非常好的。如果你是一个前端开发 应该能明白我的逻辑 今天我们就来实现这个逻辑 我把代码贴在下面 以后开发微信小程序 都可以这样去写。使用mixins 点击这个页面 没有token 就会跳转到登录页面 登录成功了 就会返回个人中心页面。这个方法 就是 跳转到用户浏览的页面 当然 这个 页面需要传到登录页面。个人中心页面需要用户登录。

假如 二选一的那种 可以 这样写 交互好看 而不是单纯的 checkbox 框。我是用的是 nut-ui 组件库中的 checkbox 组件。我们会使用到 checkbox 复选框 做一些交互的效果。我们 做前端页面交互效果的时候。这里我就不使用 gif 图片了。大家可以看看 都应该能看懂的。我把代码 和样式放在下面。类似于这样的选中效果。大家应该都可以看懂的。

最进开发 Taro + nut-ui 的H5 移动端的时候 我发现一些图标我在组件库中找不到 我看到了nut-ui 中还有另一种使用方法。这里说明一下 很多的方式使用 我们在这里使用 下载文件的方式。就正如 在nut-ui 组件库中所说的那样 的使用方式。我来用实际操作 代码 来介绍一下 这个怎么使用。把下载的文件夹 放到 这个项目 目录中 文件夹。想必大家都知道这个图标库的 图标还是很多的‘① 选择好自己想要的图标 添加到项目。③.在Taro 项目中引入。第一 给大家分享技术。下载下来文件 是这样的。

方法里的数据 是写死得 所以 我们在实际开发中 我们应该把数据变成这个格式 然后再进行导出操作。以上代码绝对好使 大家可以使用。

闲着没事 使用js 画一个小猪佩奇把。

其实很简单 但是 具体的属性 和很多 内容需要慢慢使用 慢慢看。首先我们需要先学会 去使用js 动画 封装好的。学习 动画插件 是进入大厂的必备技能。

值得一提的是，map的第二个参数就是第一个参数回调中的这个点。如果第一个参数是箭头函数，则设置第二个 this 将无效，因为箭头函数的词法绑定。另一个是稀疏数组的处理，HasOwnProperty 用于判断当前下标的元素是否存在于数组中，欢迎大家在评论区交流。使用方法：将selfMap注入到Array.prototype中（下面数组的迭代方法也是如此）

使用 Object.prototype.toString 配合闭包，通过传入不同的判断类型来返回不同的判断函数，一行代码，简洁优雅灵活（注意传入 type 参数时首字母大写）

但是 原生的小程序button 放那里又太丑了 所以现在 需要覆盖原生的button 样式。开发微信小程序的过程中 发现 需要使用button 的open-type。

有的时候 在我们开发过程中我i们会出现一个问题 就是一个后端的接口 哦我们需要调用多次才会出现结果 我们就需要连续掉用。各有各的好处吧 这个是 一直等到有结果的时候 终止循环 但是 会容易导致死循环 如果没有处理好的话。只要有结果就会停止 这样写次数 是为了防止 前端死循环。有时候为了避免后端的压力的太大。我总结了一下前端的写法。2.没有次数 的写法。

这样的数据 我想根据 hallName 来筛选数据。我不需要 带有下面字符换的数组数据。使用some 筛选一下 数据。现在有一批这样的数据。

现在有一些不等的数据 我需要通过前端 吧这个数据筛选一下 比如我使用一些 我需要的ID。比如以上的数据 的 cinemaLineId 来筛选。需要以上数组中的cinemaLineId。直接这样来筛选就行了。

H5 的拉起支付和微信小程序的拉起支付 是不太一样的。现在分享一下微信小程序中的拉起支付。我是用的Taro 框架。

就是Taro框架中提供的一个分享Api 封装好的。微信小程序 右上角分享 的触发 以及配。

顺便在这里提一下 我这对接的是node 的接口 验证码是后端返回的svg 我把验证码svg 后端逻辑也说一下啊。以上的node 的service 接口的逻辑。这是前端收到的data。

在我们前端调用接口的使用中 我们会传递参数 大部分是json 格式的 但是有的时候 回事 formData 的格式的 那我们前端就需要修改一下 传递对应的东西。如果不传递 paramsFormdata 就默认是json 传就是formData 的格式的。我说一下我使用Taro 框架中的写法 就是移动端 和小程序中的写法。我这里有一个判断 当我需要传递这个 formData 的格式的时候。我说一下在web端中的使用 我使用的是tdesign 的框架。人家封装好的request 的文件我就不写了。

我这个主要处理这个问题 （groupList）把这个分组 一下 放在一起 变成这样的数据。

这里有一个按钮 哈 我 这里会有不同的机器人 这个按钮点击的时候 会调用接口 后端异步更新商品 但是此时我不想让用户 频繁点击 因为要考虑到性能问题 所以我在这里做了一个倒计时 ，我一开始直接将这个上面的倒计时 用在这里了 发现可以使用 但是切换机器人 还是那个倒计时 不符合我的业务逻辑 所以我需要给每一个机器人一个倒计时对象。以上就是将倒计时时间存储在了当前的内存中每一次刷新 都是原来的倒计时时间 除非用户把内存删了 当然 用户一般也不懂这个 也不会去删的。下面我说一下 当前的进阶版的倒计时。

列表中有每一项 根据每一项的数据 计算 或显示其他的内容。使用computed。

如果让你手写async函数的实现，你是不是会觉得很复杂？这篇文章带你用20行搞定它的核心。经常有人说async函数是generator函数的语法糖，那么到底是怎么样一个糖呢？让我们来一层层的剥开它的糖衣。有的同学想说，既然用了generator函数何必还要实现async呢？这篇文章的目的就是带大家理解清楚async和generator之间到底是如何相互协作，管理异步的。示例对于这个实例 我们使用 generator 函数 表达出来。

以上图片选择了时间段 现在需要判断 当前选择的时间段 不能够是 有交叉的所以现在需要循环判断。

其实就是一段代码 能够 截取当前的 url 路径参数。直接传入当前的url 就行了 直接行~~~

原生html 中的滚动我这里也有部分代码 我就不详细解释了 大家都能看懂的 原生html 用的也少了 移动端中有封装好的scroll-view 所以就更简单了。这个是vue3 里实现的功能 因为是web端 一般没有这样的滚动效果 既然问题出来了 就肯定有解决办法 所以就是以上的写法。在这个里面就可以实现滚动的监听 滑动到底部 就可以知道 然后可以实现分页。给这个盒子一个ref 的属性 以及 有原生滚动事件 scroll。这个盒子里的内容就能立马滚动起来。能够在web端实现滚动分页。

我们好像就没有什么好的办法了 我们这自己写的 肯定没有组件牛 如果有这样的组件 那就直接用如果没有组件呢怎么实现呢。3. 使用box 的宽度 减去所有的item加起来的宽度 以及设置的item的margin 等。是这样的一个样式 我们使用display :flex 布局的时候 我们全部剧中。2.计算 整个box 的宽度 除去 padding margin 等以后的宽度。如果是上述的代码来说的话 总是最后的一个也是会居中的 这样就比较丑。这是我计算当前margin 的方法。这个是一个开发中的解决问题的思路。

最近在做web端的上传图片 有一个数据列表中的编辑功能 是之前上传的图片 点击编辑进入编辑页面 会显示之前写的数据 现在需要把原来上传的图片 显示出来。因为 a-upload 需要这样的数据格式 所以要将数据处理一下 循环 添加字段 就可以了。因为之前给后端上传的 图片格式 是一个数组 ["图片链接"，“图片链接”。所以回传给 a-upload 组件的时候 显示不出来。后端给我返回的数据也是这杨。