- 博客(169)
- 收藏
- 关注
RSS订阅原创 微信h5video不能自动播放和不显示问题解决
在微信中，由于安全和用户体验的考虑，自动播放视频（尤其是带有声音的视频）受到了严格的限制。特别是在iOS设备上，由于操作系统的限制，视频通常不能自动播放，除非它们被设置为静音（请注意，这仅适用于iOS设备上的Safari浏览器（包括微信内置的X5浏览器），并且需要用户之前与页面有过交互（如点击或触摸页面上的某个元素）。然而，在Android设备上，微信的X5浏览器可能会稍微宽松一些，但仍然不建议依赖自动播放功能，因为用户的浏览器设置和微信版本可能会影响这一行为。）且用户之前与页面有过交互（如点击或触摸）。
2024-07-12 16:06:10
454
原创 【html5的video标签在移动端的使用】【微信内部浏览器video自动播放】【vue-video-player】
在移动端的首页用视频做背景动画，让动画循环，自动播放，静音。
2024-07-12 11:42:44
438
原创 uniapp：手把手写一个模糊搜索
模糊搜索的功能是很常见的一个功能，但是在写uniapp移动端项目时并没有发现很好用的组件之类的，所以决定自己小小的造一手，其实早在以前写过一个类似的功能并发布在了插件市场，但是回头再看时，感觉不太行。之后也会发布在插件市场，如果没有bug的话😁；思路：当用户在输入框内输入值时，进行请求服务，拿到返回值，若列表长度大于0，展示返回值，否则展示无匹配内容，用户点击选中值，关闭列表展示框，其中还牵扯到了下一页加载的问题。
2024-07-11 18:26:10
295
原创 【JavaScript基础语法】正则表达式——限制input输入框只能输入字母、数字、字符等
场景复现最近在项目中碰上了限制input输入框的输入内容的需求，于是查阅了资料，总结以下这些非常实用的JavaScript正则表达式。本文所用的组件以的a-input组件为例：（所有input输入框都适用）
2024-07-08 17:42:28
508
原创 JS日期格式化——数字日期转中文日期（封装函数，dayjs时间格式化YYYY-MM-DD）
当我们输入"2022222"、"2022-2-22"或者"2022年2月22日"时，结果就不对了。，各类办公文件也会涉及到日期的处理——中文格式（二〇二二年十二月二十二日）。调用此函数，传入参数"2022-12-22"，在控制台打印结果。，可以是2019-04-03,2019年04月03日，下面我们来获取当前时间，并进行中文格式日期转换。是其他的格式，可以尝试用dayjs进行类型转换。输入的格式不满足标准的YYYYMMDD格式。在团队或者企业的后台管理系统中，会涉及到。所以在使用此函数时，需要进行。
2024-07-08 17:32:19
448
原创 JavaScript获取数组对象里面的键(key)和值(value)
我们知道从 JSON 对象中检索一个值，只要我们有它的键。但是当我们应用 Object.Keys() 函数时，它返回的键是 [“0”, “2”, “3”, “4”]，按排序顺序排列。使用 Object.keys()，我们只得到一个对象的键，但是使用 Object.entries(obj)，我们可以得到一个对象中的所有条目，包括 keys 和它们的 values.的数据，这个时候我们就需要通过键来获取值，因此本期文章以此为主线，详细介绍三种方法获取数组对象里面的键(key)和值(value) 对象键值。
2024-07-08 17:27:19
555
原创 微信小程序——监听页面滑动（二）判断用户在做向上滑动还是向下滑动（onScrollPage scroll-view）
在上期文章中，我们简单介绍了如何监听页面滑动，但是在文章的最后留下了一个问题。我们如何判断用户是在做上滑操作还是下滑操作？本期文章将用两种方法（onPageScroll或者touchstart、touchmove、touchend）解决这个问题。上滑和下滑的监听都实现了。下面我们简单介绍一下第二种方法。大，则用户是在向上滑动，反之则是向下滑动。事件来判断用户的滑动方向。事件中记录下手指触摸的位置。事件中记录下手指移动的位置。微信小程序中可以通过监听。
2024-07-08 17:05:33
739
原创 【已解决】微信小程序报错：request 合法域名校验出错 如若已在管理后台更新域名配置，请刷新项目配置后重新编译项目，操作路径：“详情-域名信息”
会出现一下报错，甚至连手机移动端使用时也会出现“网络出错了”这样的错误提示。查看微信官方的文档和网上的一些解决方法，可以按照下面的图文步骤进行设置👇👇👇。按照以上方法即可解决报错。现在控制台没有任何红色的报错信息，干干净净！第二步，点击详情页中的本地设置，将不校验合法域名勾选上。第一步，点击右上角的详情按钮，进入详情设置面板。最近在写微信小程序时，打开。
2024-07-08 16:58:54
187
原创 vue3【watch检测/监听】watch检测数据变化&&监听使用
计算属性允许我们声明性地计算衍生值。然而在有些情况下，我们需要在状态变化时执行一些“副作用”：例如更改 DOM，或是根据异步操作的结果去修改另一处的状态。在组合式 API 中，我们可以使用watch函数在每次响应式状态发生变化时触发回调函数。vue中watch用来监听数据的响应式变化.获取数据变化前后的值watch的完整入参watch(监听的数据，副作用函数，配置对象)watch第一个参数是监听的数据对象, 可以是单个变量、数组、函数第二个参数是数据改变时的回调函数, 有2个参数, 第一个是。
2024-07-08 16:55:58
868
原创 vue3项目实战中的接口调用
接口往往是在方法中进行调用，对于不同接口 ，需要的参数也不一样，根据需求，我们传入对应的参数即可。在页面中，如果我们需要使用某个接口。则需要进行引入操作。以上就是接口调用的全部过程了。一个项目往往由这几个部分组成。文件夹下，命名采用驼峰命名法，比如。我们常常将接口文件，新建在文件夹。中，每个页面设一个文件夹，其中。调用接口有三种方式：fetch。后期文章持续更新 详细讲解。内的文件便是接口文件。） 后期文章将进行补充讲解。文件夹中的内容如下👇👇。内容则是本页面的内容。通常把后端的接口写在。
2024-07-08 16:50:09
177
原创 vue3项目实战的请求接口问题（一）跨域问题+解决方法
在的过程中，我们会碰到各种各样的问题，可以分为（Body）（参数名数据格式）、（URL），其中*请求地址会涉及到的解决，从而实现请求地址的成功请求。👏👏👏本期文章将会介绍跨域问题，并推荐两种用在不同领域的解决方法。👏👏👏当我们遇到请求后台接口遇到 Access-Control-Allow-Origin时，那说明跨域了。（如下图👇👇）
2024-07-08 16:45:11
574
原创 vue3项目实战中的接口调用方法（一）async/await用法 对axios二次封装 实现异步请求
在进行实际开发时会遇到异步请求的问题，这时候我们异步请求的存在就非常具有合理性了。async 是异步的意思，而 await 是等待的意思，await 用于等待一个异步任务执行完成的结果。🔥1.async/await 是一种编写异步代码的新方法（以前是采用回调和 promise）。2. async/await 是建立在 promise 的基础上。3. async/await 像 promise 一样，也是非阻塞的。🔥4. async/await 让异步代码看起来、表现起来更像同步代码。
2024-07-08 16:40:47
747
原创 css实现鼠标禁用（鼠标滑过显示红色禁止符号）
从本文开始，将会用三篇文章来一步一步实现 vue+antd+ts实战后台管理系统中table表格的不可控操作。注：使用禁止触发事件时，鼠标样式会失效，变成箭头，即cursor:not-allowed;实现表格的不可控有两种实现方案，一种是 通过css的禁用操作来实现，另一种是 通过ant design vue自带的api属性来实现。vue antd项目实战——修改ant design vue table组件的默认样式（css样式穿透）css实现鼠标禁用（鼠标滑过显示红色禁止符号）
2024-07-08 11:31:58
325
原创 vue3+vite+axios 配置连接后端调用接口的实现方法
编写具体的请求，建议按照项目具体情况分文件编写。在本地项目中新建一个文件夹。文件夹中编写以下文件。
2024-07-04 15:37:08
171
原创 Vue3生命周期
1、setup() : 开始创建组件，在 beforeCreate 和 created 之前执行，创建的是 data 和 method。8、onActivated(): 被包含在 <keep-alive> 中的组件，会多出两个生命周期钩子函数，被激活时执行；9、onDeactivated(): 比如从 A 组件，切换到 B 组件，A 组件消失时执行；2、onBeforeMount() : 组件挂载到节点上之前执行的函数；4、onBeforeUpdate(): 组件更新之前执行的函数；
2024-07-04 15:33:22
324
原创 3分钟带你了解Vue3的nextTick()
Vue 实现响应式并不是数据发生变化之后 DOM 立即变化，而是按一定的策略进行 DOM 的更新。简单来说，Vue在修改数据后，视图不会立刻更新，而是等同一事件循环中的所有数据变化完成之后，再统一进行视图更新，nextTick()方法就会在这样的DOM更新循环结束后调用指定的函数。
2024-07-04 15:31:05
731
原创 reactive和ref有什么区别
reactive 和 ref 是 Vue 3 中的两种响应式数据绑定方式，ref 适用于简单的响应式数 据，而 reactive 则适用于复杂对象或数组的响应式数据。
2024-07-04 15:27:23
149
原创 vue3.0和vue2.0的区别详细讲解
vue经历从2.0到3.0更新之后,简⽽⾔之就是变得更轻更快,使⽤起来更加⽅便,下面这篇文章主要给大家介绍了关于vue3.0和vue2.0区别的相关资料,需要的朋友可以参考下Vue 3.0是一个用于构建用户界面的JavaScript框架。相比于Vue 2.x，Vue 3.0在性能、体积和开发体验上都有了很大的提升。
2024-07-04 15:23:41
564
原创 vue3中watch监听的四种写法
本文主要介绍了vue3中watch监听的四种写法,包含了ref 定义的数据,reactive定义的数据,函数返回的值（getter函数）和前面3个内容的数组,具有一定的参考价值,感兴趣的可以了了解一下作用：监视数据的变化（和vue2中的watch作用一致）特点：vue3中watch只能监视以下四种数据：1、ref 定义的数据2、reactive定义的数据3、函数返回的值（getter函数）4、前面3个内容的数组。
2024-07-04 15:15:03
229
原创 七种Vue3传值方式
在使用选项式API时，我们可以通过this.$refs.name的方式获取指定元素或者组件，但是组合式API中就无法使用哪种方式获取。如果我们想要通过ref的方式获取组件或者元素，需要定义一个同名的Ref对象，在组件挂载后就可以访问了。provide和inject是Vue中提供的一对API，该API可以实现父组件向子组件传递数据，无论层级有多深，都可以通过这对API实现。setup组件默认是关闭的，也即通过模板ref获取到的组件的公开实例，不会暴露任何在**
2024-07-04 15:08:23
528
原创 Vue3全局配置Axios并解决跨域请求问题示例详解
在这里，我们自定义axois实例化对象，配置了默认的访问i后端ip和端口等，并在末尾使用export 导出api配置，便于在其他单文件中引入 request.ts.对于前后端分离项目，前端和后端端口不能重复，否则会导致前端或者后端服务起不来。这里提供两种解决方案，都是基于后端跨域访问的配置，前端不作任何允许跨域访问的设置，因为试过无效。（1）axios 是一个基于promise的HTTP库，支持promise所有的API。在项目根目录下，也就是src目录下创建文件夹api/，并创建。
2024-07-03 14:16:48
1355
2
原创 vue3项目实战中的接口调用
接口往往是在方法中进行调用，对于不同接口 ，需要的参数也不一样，根据需求，我们传入对应的参数即可。文件夹下，命名采用驼峰命名法，比如。一个项目往往由这几个部分组成。我们常常将接口文件，新建在文件夹。中，每个页面设一个文件夹，其中。调用接口有三种方式：fetch。后期文章持续更新 详细讲解。内的文件便是接口文件。） 后期文章将进行补充讲解。文件夹中的内容如下👇👇。需要安装 /store。内容则是本页面的内容。通常把后端的接口写在。
2024-07-03 14:05:46
186
原创 uniapp swiper 卡片轮播 修改指示点样式效果demo（整理）
【代码】uniapp swiper 卡片轮播 修改指示点样式效果demo（整理）
2024-05-30 11:13:22
342
原创 微信小程序之实现弹窗组件及点击弹窗按钮实现页面跳转
校园二手书交易，不限品类，诚信标价，让校园二手书合理流通起来！！！卖书规则</button><button class="popup-button confirm-btn" bindtap="closePopup">开始卖书
2024-05-30 10:57:15
464
原创 解决微信小程序自定义弹窗滚动穿透问题
在小程序页面里有自定义弹窗时候，发现弹窗外滚动的时候，底部背景页面也会跟随滚动。的高度设置为屏幕高度，这样就可以实现弹窗自身内容滚动时，而底层内容不滚动。可以实现弹框背景不滚动，但是也会导致弹框自身无法滚动。如果你的弹窗本身是不需要滚动的，用这个方法是极佳的。但是这种方式会导致页面自动回到顶部。最外层元素动态添加fixed类。
2024-05-30 10:46:37
334
原创 el-input 限制输入框只能输入数字和小数以及表单常用的校验规则
oninput =“value=value.replace(/[^0-9.]/g,‘’)” //只能输入数字和小数。oninput =“value=value.replace(/[^\d]/g,‘’)” //只能输入数字。
2024-05-28 16:26:28
867
原创 基于SqlSugar的开发框架循序渐进介绍（20）-- 在基于UniApp+Vue的移动端实现多条件查询的处理
介绍了前面基于Vue3+Typescript+ElementPlus的前端界面的内容，主要还是用来引出基于UniApp+Vue的移动端实现多条件查询的处理，一般移动端的界面空间比较宝贵，所以往往查询通过组合条件的方式进行模糊查询处理，如下界面所示。在查询框中输入一些条件，会在后端对多个条件进行模糊匹配，并返回相应的结果列表进行展示，如下所示。查询界面只是接受了一个输入值，通过传递该值，在后端进行多字段的匹配查询处理。前端界面如下所示。
2024-05-27 14:39:03
1762
原创 uniapp 引用 js 组件的方法(场景分析)
在UniApp开发中，我们使用的是Vue框架，因此，可以直接在.vue文件中引入JS文件。其中 @ 表示项目根目录，util 是 js 目录下的一个非模块化 js 文件。其中 @ 表示项目根目录，handleDecodedXML 表示导入的方法。
2024-05-27 14:15:04
951
原创 uni-app快速入门
uni-app是一个非常优秀的跨平台应用开发框架，具有上手简单、开发效率高、性能优秀等优点。通过学习uni-app的基础语法、组件、API，可以快速掌握uni-app的开发技能，为开发跨平台应用打下坚实的基础。uni-app官网。
2024-05-24 15:43:07
965
原创 UNIAPP开发注意事项
12.非 H5 端不支持使用含有 dom、window 等操作的 vue 组件和 js 模块，安装的模块及其依赖的模块使用的 API 必须是 uni-app 已有的。45.分享到 QQ 必须含有 href 链接，分享文字到 QQ 时，title 必选，不能直接分享到QQ空间，可以分享到QQ，然后在QQ的界面里选择QQ空间。8.App端，在 pages.json 里的 titleNView 或页面里写的 plus api 中涉及的单位，只支持 px，不支持 rpx。如果你需要固定高度，则应该使用 px。
2024-05-24 15:13:56
466
原创 uni-app的简介及用法
uni-app是一个使用vue的语法 + 微信小程序的标签和API的跨平台前端框架，开发者编写一套代码，可编译发布到iOS、Android、H5、小程序等多个平台。第一步，在HBuilderX选择运行->运行到小程序或模拟器->运行设置。一些标签/组件等的使用，延续用的微信小程序，js一些等对逻辑的处理，使用的vue.js的语法。js 因为uni-app的api是参考小程序的，所以和浏览器的js api有很多不同，如。标签的不同，以前使用的是html的标签，现在使用小程序的标签。注意要安装相对应的插件。
2024-05-24 15:09:33
277
原创 el-input只能输入整数，小数、最多保留两位小数、最多输入4位小数，过滤el-input输入框中的特殊符号
【代码】el-input只能输入整数，小数、最多保留两位小数、最多输入4位小数，过滤el-input输入框中的特殊符号。
2024-05-23 11:38:15
1405
原创 微信SVG图文部署手册
以下使用chrome浏览器演示，下载地址Google Chrome 网络浏览器代码阅读和部分操作使用了vscode编辑器，下载地址https://code.visualstudio.com/素材及代码下载地址： gtja本地代码及素材.rar登录公众号，将images文件夹中的所有图片上传到素材库，为了避免混乱，最好在素材库中新建分组后上传注意：微信单次上传图片有数量限制，只能分批上传上传后，点击查看大图在打开的大图中，右键复制图片地址使用编辑器打开代码，在打开的文件中使用Ctrl+F快捷键搜索图片名称，进
2024-05-22 14:20:04
306
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人