- 博客(31)
- 收藏
- 关注
RSS订阅原创 uniapp 使用htmlPlus从相册选择照片并上传OSS
OSS 签名：在实际应用中，直接上传到 OSS 通常需要进行签名，以确保安全性。你需要在服务器端生成签名并将其传递到前端进行上传。CORS 设置：确保你的 OSS Bucket 已经配置了 CORS，允许客户端直接上传。SDK 使用：可以考虑使用阿里云官方提供的 OSS SDK，这样可以简化签名和上传流程。
2025-03-05 14:55:42
338
原创 uniapp webview web-view组件监听网页变化 url变化 与网页通讯
uniapp 使用web-view组件监听网页变化 url变化 与网页通讯，获取h5的全部数据
2024-11-28 10:51:34
1541
1
原创 uniapp 使用webview组件实现长截图
需求是在uniapp里 对webview组件里的网页进行长截图，获取图片传给后端进行ocr识别
2023-07-06 19:16:09
2352
2
原创 web 串口通讯navigator.serial
async serial() { // 浏览器支持serial if ('serial' in navigator) { // 获取用户之前授予该网站访问权限的所有串口 const ports = await navigator.serial.getPorts() if (this.port === null) { if (ports.length > 0) { // 已经连接过 ..
2021-11-22 11:46:05
7717
8
原创 uniapp html5+ plus蓝牙连接电子秤
uniapp /html5+ 蓝牙连接电子秤<template> <view class="container"> <uni-nav-bar title="设备管理" left-icon="back" fixed backgroundColor='#fff' color='#000' :border='false'> </uni-nav-bar> <view class="ul"> <view class="li" v
2021-11-22 11:09:11
2838
原创 uniapp运行基座到电视机调试
电视机APP1.开启电视adb调试2.查看wifi ip3.项目终端输入命令adb connect 192.168.0.108//ip地址是wifi ip//电脑和电视机连接同一wifi4.运行基座可能会出现 找不到文件，那就换成标准基座调试。5.如果第一次安装不上基座 可以用u盘手动安装......
2021-11-22 11:06:28
2716
6
原创 web连接蓝牙电子秤navigator.bluetooth
web连接蓝牙获取电子秤的重量data(){return {bluetoothStatus:false,device:null,weight :null //获取到的重量}}async connectBluetooth() { // 连接蓝牙if (this.bluetoothStatus) {return alert(‘你已经连接了蓝牙’)}const _this = thisif (‘bluetooth’ in navigator) {console.log(‘浏览器支持b
2021-11-22 11:00:16
2491
原创 uniapp 开发电视机APP 基座连接电视机
1.开启电视adb调试2.查看wifi ip （电脑和电视机需要连接同一wifi）3.项目终端输入命令adb connect 192.168.0.108 （ip地址是wifi ip ）4.运行基座可能会出现 找不到文件，那就换成标准基座调试。5.如果第一次安装不上基座 可以用u盘手动安装如果遇到文件不存在 可以安装标准基座调试，不过云打包正式包是没事的。...
2021-09-16 11:05:08
5847
原创 uniapp 字体引入
uniapp 小程序引用字体官方链接我们用到的字体可能会很大，比如我用到的阿里普惠字体就有8M，这么大的字体不管是放服务器还是放小程序内都是很不友好的。推荐一个压缩插件 font-spiderfont-spider会帮我们剔除不需要的文体比如你需要某一个特殊字体，而项目中只有标题 分类啥的可以用到那就推荐你使用这个。比如我项目只用到大概五十多个字。把文字写在html文件的div里面在html页面引入自己需要的特殊字体font-spider会根据你页面使用到的字体和文字去压缩这样压缩完后，
2021-05-11 09:08:42
3695
6
原创 uniapp 全局方法封装
/** * 页面跳转 * @author hhy * * @param {String} url 需要跳转的应用内非 tabBar 的页面的路径 * @param {Object} animationType 窗口显示的动画效果 * @param {Object} animationDuration 窗口动画持续时间，单位为 ms */const to = (url, animationType = 'pop-in', animationDuration = 300) => { .
2021-04-29 22:11:48
2531
原创 uniapp网络请求uni.request封装
uniapp网络请求uni.request封装import Vue from 'vue'export function request(url, data, method = 'get', contentType = 1) { const baseUrl = Vue.prototype.$baseUrl; let header = { 'content-type': contentType === 1 ? 'application/json' : 'applica
2021-04-29 22:07:19
1182
原创 js实现倒计时
js实现倒计时：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <tit
2021-04-29 22:04:07
1805
翻译 javaScript的作用域
作用域是一套规则，用于确定在何处以及如何查找变量（标识符）。如果查找的目的是对变量进行赋值，那么会使用LHS查询；如果目的是获取变量的值，就会使用RHL查询。赋值操作符会导致LHS查询。=操作符或调用函数时传入参数的操作都会导致关联作用域的赋值操作。JavaScript引擎首先会在代码执行前对其进行编译，在这个过程中，像var a = 2这样的声明会被分解成两个独立的步骤：1．首先，var a在其作用域中声明新变量。这会在最开始的阶段，也就是代码执行前进行。2．接下来，a = 2会查询（LHS查询）变
2021-03-31 11:53:13
162
原创 vue 数据发生改变，视图确没发生改变。
有一段时间没碰到bug了，昨天碰到一个bug，弄的头有点小疼。父组件里面，我请求接口获取数组 传给子组件 :list=list;子组件接收。for list渲染列表。。我的需求就是列表的每一项可以点击选中，再点击取消就是点击左边的勾选。然后我想的是，给list下的每个对象加一个check属性，在图片那里用三元表达式，为true就显示选中，为false就显示未☑️。点击的事件 cell(item,index) .我把当前项和index传了过来。在事件里面我用 item.check=!item.
2020-11-13 11:22:55
532
原创 css弹性盒子 子元素不压缩超出父盒子
我想实现一个横向滚动，但是父盒子是弹性盒子,display:flax;子元素给多宽都默认不超出父盒子的宽度；。flex-shrink:0;子盒子加上这个属性就可以实现了，就不会再压缩你的子元素了。横向滚动也可以了...
2020-10-30 14:42:37
7204
原创 mac电脑生成微信开发平台应用签名
第一次搞也是网上找半天，mac电脑的文章比较少，还是记录一下，防止以后自己再用到1.先用命令‘sudo -s’ 获得系统权限 Mac终端命令，下载java jdk可以查看版本，检查是否安装好2.用/usr/libexec/java_home命令得到的Java Home路径3.使用keytool命令 keytool -genkey -alias android.keystore -keyalg RSA -validity 20000 -keystore android.keystore接着
2020-10-26 16:02:33
1330
原创 uniapp app端使用html2canvas和renderjs实现生成海报图
uniapp app端使用html2canvas和renderjs实现生成海报图原本app端是无法使用html2canvas的因为，app端不支持浏览器js。不过我在uniapp里面看到了renderjs。使用这个就可以帮助我们在app端内使用浏览器对象了。这样html2canvas也就可以实现了。renderjsrenderjs是一个运行在视图层的js。它比WXS更加强大。它只支持app-vue和h5。renderjs的主要作用有2个：大幅降低逻辑层和视图层的通讯损耗，提供高性能视图交互能力
2020-10-26 15:49:57
5462
4
原创 uniapp跨端开发h5到APP
uniapp跨端开发h5到APP第一次跨端开发，把注意的事情和方法。记录一下；uniapp官网跨端开发提示uniapp官网的条件编译如果准备做跨端开发或者正在做的，一定要好好看看这两个官网地址。在app端：没有浏览器专用的js对象，比如document、xmlhttp、cookie、window、location、navigator、localstorage、websql、indexdb、webgl等对象。这些都是不能用的，否则页面可能是直接白屏。我是吃到苦头了，做h5的时候是一个劲的往前干
2020-10-20 18:40:31
1632
原创 滚动到一定距离显示，点击返回顶部
<!-- 返回顶部 --> <template> <div v-if="navtab" class="top" @click="top"> <img src="../../static/top.png" alt /> </div></template> data() { return { navtab: false, }; }, mou..
2020-10-13 15:43:19
1503
原创 解决h5第一次进入页面盒子缩放 数字出现undefined
1.将template下的第一个盒子隐藏.product { visibility: hidden;}2.给这个盒子绑定 ref<template><view class="product" ref="details">3.在接口数据拿到的地方设置盒子显示 this.$refs.details.$el.style.visibility = "visible";这是我用的比较好的一个方法。如果是jquery项目，也可以同原理，第三步改成定时器里异步修改dom
2020-10-10 11:07:35
1375
原创 html盒子横向滚动
父盒子css:width: 100%; overflow: hidden;overflow-x: scroll;white-space: nowrap; //使用这个后，子盒子文字会在一行显示 子盒子css：display: inline-block;white-space: normal;//子盒子加上这个就可以内容就可以自动跨行了...
2020-10-10 10:56:56
2824
原创 uniapp h5/app实现pdf在线预览/vue中pdf.js使用
微信公众号h5实现pdf在线预览/vue中pdf.js使用最近做的一个公众号项目，项目需求需要在页面内预览pdf文件。本来想直接用链接去预览，结果发现安卓手机会直接提示下载，ios可以预览，这样是不满足需求的。最后使用了pdf.js。官网下载地址https://mozilla.github.io/pdf.js/getting_started/#download下载好后，第一步将文件放在static文件下在这里插入图片描述第二步我用的是iframe，因为我的页面还要放其他东西。 &l
2020-10-09 18:46:16
19337
44
转载 uniapp开发微信小程序获取用户手机号
写的很好的文章 记录一下https://ask.dcloud.net.cn/article/37452这个文章写的很详细，有需求的可以去看看。
2020-09-28 16:58:22
1872
原创 h5 生成海报图和生成二维码
生成海报图和二维码，如果是vue的话，先下载两个插件QRCode和html2canvashtml//海报html元素放这个标签内 <div id="posterHtml" v-show="true"></div> <!-- 海报图 --> <div class="posterImg" v-show="posterShow"> <img :src="posterImg" alt /> </div&
2020-09-15 11:23:16
2043
1
原创 uniapp h5微信分享
最近用uniapp做的一个公众号h5的项目，实现微信分享操作，第一次接触的新手可能有点蒙，其实很简单的。先下载微信 js-sdknpm install jweixin-module --save官方地址：https://ask.dcloud.net.cn/article/35380官网怎么使用也是很简洁，直接忽略了新手的感受。新手不要慌，网上很多方法，但是主要是弄懂了，看懂别人写的代码。你就会发现套上去，改哪些地方就能是自己的方法了。我们下载好微信jssdk后，我们先建一个js文件，wecha
2020-09-15 11:00:19
4973
17
原创 uniapp h5底部弹出层相机和相册
项目中做的一个功能，我想把项目中的每一个功能都用写博客的方式记录下来，说不定以后还能用上呢。也相当于给自己做笔记了。做这个功能需要我们在uniapp的插件市场上下载一个uniPopup弹出层的组件。先上代码HTML <div class="box"> <div v-for="(item,index) in imgList" :key="index" class="upcertImg"> <img :src="item" alt
2020-09-15 10:13:41
2127
原创 vue实现微信分享遮罩层禁止点击禁止滚动
vue实现遮罩层禁止点击禁止滚动先看效果图直接上代码html 遮罩层 <div class="mask" @touchmove.prevent @click="mask=false"> //点击自身是关闭 <div class="maskImg"> <img src="../../static/fxhy.png" alt /> </div> </div> <di
2020-09-11 18:19:04
1473
2
原创 Sortable.js拖拽排序插件拖拽的时候不能滚动页面问题
github地址：https://github.com/SortableJS/Sortable#readme用线上地址js是正常的，当我把线上js复制到本地的时候发现，拖拽的时候不能滚动。forceFallback: false, // ignore the HTML5 DnD behaviour and force the fallback to kick in把这个属性改为true就可以了。SortableJS还是比较好用的插件，拖拽的时候比较丝滑，jquery也有一个拖拽插件，拖拽后
2020-08-18 16:16:29
4111
4
原创 H5返回键怎么去不按历史记录回滚
location：存储了大量的关于当前页面的地址信息。还有连接到web服务器的端口等（这个不是重点）history这个对象存储了浏览器浏览过得历史页面（它里面有个历史栈）。所以每次跳转都会产生一条浏览记录添加到history里面，返回键是按history里的历史记录来回滚。想要实现点击返回键不会滚上一页，可以使用location.replace(‘url’)history.go(-1) 也是不会产生浏览记录...
2020-08-14 16:24:20
1629
原创 前端CSS @media 媒体查询PC端
前端CSS @media 媒体查询PC端注意and后面跟一个空格@media screen and (min-width: 1024px){body{font-size: 12px}} /*>=1024的设备屏幕*/ @media screen and (min-width: 1100px) {body{font-size: 14px}} /*>=1100的设备屏幕*/@media (min-width: 1280px) {body{font-size: 18px;}} /
2020-08-14 16:14:29
2171
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人