- 博客(49)
- 收藏
- 关注
RSS订阅原创 uniapp 中使用 vue vite
import { defineConfig} from 'vite'import uni from '@dcloudio/vite-plugin-uni'export default defineConfig({ plugins: [ uni() ], server: { port: 2020, proxy: { '/apiv1': { target: 'http://192.168.6.87:9019', // 目标服务 changeOrigin: tr.
2023-04-21 09:21:18
508
原创 Ts学习笔记
any 任何类型都可以赋值给any。any也可以给任何类型赋值unknown 任何类型可以赋值给 unknown ，但是 unknown 类型赋值给其它类型需要对其进行类型缩小。type类型一般都是大写字母开头类型谓词返回一个布尔类型is XXX调用签名可以给函数添加属性不可以给函数定义name属性名构造签名类型参数是用来关联多个值的类型的。如果一个类型参数在函数签名中只使用一次，那么他是没有必要再次定义的可选参数?不能与参数默认值同时使用 fun.
2022-04-09 09:59:43
961
1
原创 在微信小程序中 使用uView rules 表单校验 validator 不起作用（无效）
注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则onReady() { // 如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则 this.$refs.form1.setRules(this.rules) },...
2022-03-03 08:37:39
8228
7
原创 uniapp 对富文本中的图片预览及长按图片识别二维码/保存图片
uniapp 对富文本中的图片预览及长按图片识别二维码/保存图片富文本一定要使用uniapp提供的<rich-text>标签，不要使用 v-html因为<rich-text>标签提供了拦截点击事件@itemclick，可以拦截点击事件（只支持a、img标签），返回当前节点信息<rich-text :nodes="appInfo.content" @itemclick="goImgDetials"></rich-text>上面的操作能够获取到
2022-01-11 13:34:42
5255
4
原创 uniapp 使用Vue3 setup组合式API 引入 uniapp 的 页面生命周期（onReachBottom）等方法
uniapp 使用Vue3 setup组合式API 引入 uniapp 的 页面生命周期（onReachBottom）等方法
2021-12-10 13:32:43
9504
7
原创 使用jsmpegjs前，先把利用 ffmpeg 将 MP4 格式的文件转换为 ts 格式
利用 ffmpeg 将 MP4 格式的文件转换为 TS 格式ffmpeg官网：http://ffmpeg.org/download.htmlffmpeg下载地址： https://github.com/BtbN/FFmpeg-Builds/releases下载完，解压完成后，在 bin 目录下,打开 命令行工具 输入下面指令即可ffmpeg -i test.mp4 -f mpegts -codec:v mpeg1video -s 960x540 -b:v 1500k -r 30 -bf 0
2021-11-20 11:34:06
2639
1
原创 结合Vue的虚拟表格滚动思路分享
结合Vue的虚拟表格滚动当存在不需要分页，并且数据量较多的表格场景时，因渲染大量数据、页面结构造成页面渲染过慢。就产生了虚拟表格。虚拟表格，个人理解：只展示一定量的数据，比如20条，只渲染能看到的这20条数据，其他的数据暂时不渲染。当鼠标向下滚动滑轮的时候，再去渲染下面的数据。滚动过去的数据同样不需要渲染。没事捣鼓的小案例，肯定是有许多瑕疵，就是想分享一下思路。有好方法要分享，请评论。思路只渲染看得到的数据，看不到的先不渲染利用鼠标滚动事件，计算判断滚动位置，对展示出来的数据进
2021-11-06 15:14:37
1788
原创 uniapp 打包后的App使用 new Date().toLocaleDateString() 无法获取 2021/10/29 格式的时间
使用手机模拟器和真机调试，均能通过new Date().toLocaleDateString()获取到2021/10/29格式的日期。但是在 app 打包后获取到的是查看了一下 MDN 中对 toLocaleDateString() 方法的解释:返回该日期对象日期部分的字符串，该字符串格式因不同语言而不同。新增的参数 locales 和 options 使程序能够指定使用哪种语言格式化规则，允许定制该方法的表现（behavior）猜测应该是因为这种原因导致。解决方法：1. let.
2021-10-29 10:06:00
1950
原创 uniapp 中 H5端 使用 video 使其全屏横屏播放
起因： H5端 uniapp 提供的 video 组件，在点击其全屏按钮后，进入全屏状态，视频显示部分仍然为竖屏显示，无法转换成横屏，查阅了大量的资料。官方人员说 H5端不支持 了解详情但是客户提出来了就要想办法解决解决方案：自定义 video 组件，不使用官方组件使用 css 进行样式修改强制 横屏就有了第一版获取video标签，对齐进行css样式修改… 简单粗暴需要把video原生带的全屏隐藏掉(有这个属性show-fullscreen-btn改成false就可以了)，自己再写一个
2021-09-13 14:52:01
13216
5
原创 uniapp 等图片文件全部上传成功后，再继续执行js代码（图片压缩，同步上传）
uniapp 等图片文件全部上传成功后，再继续执行js代码起因前几天在写一个简单表单提交的时候，遇到了一个文件上传的问题。这个表单，需要上传三类图片，而且每一类都是可以多张上传的。使用文件上传的组件，一般都是选择图片后，他就会自动进行服务器的上传，但是我很难去判断要上传的图片，是不是已经全部上传成功了（后端同学不给写批量上传，又是一个我下决定学学后端的原因）。我使用了一个定时器，去循环判断是不是图片全部上传成功了（这方法太傻了，而且极易出问题）。结果，在测试的时候，发现，很多手机 上传了图片提示没
2021-08-23 08:51:40
2062
转载 mysql忘记密码时，重置密码
第一步 ：https://www.cnblogs.com/sunyang-001/p/10829773.html第二步： https://blog.csdn.net/yhj198927/article/details/103745946
2021-08-09 16:38:47
106
原创 在 uni-app 中使用 webview 打开本地文件，打开不成功
在 uni-app 中使用 webview 打开本地文件，打开不成功出现套娃现象的解决方案小程序仅支持加载网络网页，不支持本地html排查本地文件是否按照官方给出的路径建立的。uni-app 项目根目录->hybrid->html 文件夹下或者 static 目录下 <web-view src="/hybrid/html/local.html" :webview-styles="{height:'100%'}"></web-view>本地路径建立正确
2021-08-09 11:25:04
5355
6
原创 layUI 第三方 扩展组件 treeTable 树形表格 示例文件
layUI 第三方 扩展组件 treeTable 树形表格 示例文件官方示例链接 失效了，找不到了，找了好久，找到了一个链接：https://pan.baidu.com/s/1_pmNLFlNY1kJxNVgD2COTA提取码：eayk该链接由 代码先锋网 提供的。感谢大佬。...
2021-07-21 10:26:43
486
原创 深入 探究 JavaScript
深入探究 JavaScriptinstanceof运算符用于检测构造函数的 prototype 属性是否出现在某个 实例对象 的原型链上。// 手写一个 instanceof function MyinstanceOf(child, parent) { if (typeof child != 'object' || child == null) return false; let proto = Object.getPrototypeOf(child); while (t
2021-07-01 16:14:35
95
原创 原生js 列表循环滚动
先介绍几个属性clientHeight 元素的高度clientTop 元素顶部边框的宽度scrollTop 滚动条遮挡的部分的高度（包含border）scrollHeight 整个内容的高度（包含border）offsetTop 距离上一个 position 不为 static(默认) 的元素的顶部内边框的距离<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" /&g
2021-06-23 16:05:34
896
原创 Vue 3 模板指令
模板指令组件上 v-model 用法已更改，替换 v-bind.synchttps://blog.csdn.net/qq_42460461/article/details/117898769key 属性Vue 3.x 不建议在 v-if/v-else/v-else-if 的分支中使用 key，如果非要使用，请设置唯一的key值。Vue 3.x 可以将 key值 设置在template 上 (Vue2.x 需要将key值设置到子节点上)v-if 与 v-for 的优先级对比
2021-06-21 11:26:41
243
原创 Vue3 全局 API 变更
Vue3 全局 API 变更全局API和配置从技术上讲，Vue 2 没有“app”的概念，我们定义的应用只是通过 new Vue()创建的根 Vue 实例。从同一个 Vue 构造函数创建的每个根实例共享相同的全局配置大致就是 如果创建了多个 Vue 根实例，他们也会共享Vue.use() Vue.minx() 等一些全局配置，不利于 Vue 项目的测试等一些操作createApp调用 createApp 返回一个应用实例 import { createApp } from 'v
2021-06-16 08:07:20
245
原创 Vue 配置使用 externals 使用cdn减小打包体积 (前端优化)
Vue 配置使用 externals 使用cdn减小打包体积在 vue.config.js 中 书写配置 // 引入webpack const webpack = require('webpack'); const path = require('path'); const assetsCDN = { // 放置需要使用 cdn 的库 externals:{ vue: 'Vue', 'element-plus': 'ElementPlus'
2021-06-15 16:32:28
3632
1
原创 Vue3 可以允许出现多个根节点
片段Vue3 一个模板不再限制有多个根节点(多个根节点上的 Attribute 继承) 需要显式定义 attribute 应该分布在哪里。否则 控制台会给出警告提示 <template> <header></header> <main v-bind="$attrs"></main> <!-- 父组件传的方法和参数可以通过 $attrs 访问 ，子组件 props 和 emits 中 出现的
2021-06-14 11:02:01
6539
2
原创 Vue3 触发组件选项(自定义事件)
触发组件选项(自定义事件)事件名事件名提供了自动的大小写转换，在子组件中使用驼峰命名的方法触发一个事件，父组件中通过-的形式 书写触发对应的方法名 this.$emit('myEvent'); <parent-com @my-event="myEvent" ></parent-com>定义自定义事件可以通过 emits 选项在组件上定义已发出的事件。当在 emits 选项中定义了原生事件 (如 click) 时，将使用组件中的事件替代原生事件侦听器
2021-06-14 10:44:44
3817
1
原创 Vue3 Teleport
TeleportTeleport 提供了一种干净的方法，允许我们控制在 DOM 中哪个父节点下渲染了 HTML.属性to: 有效的查询选择器或 HTMLElementdisabled :用于禁用 <teleport> 的功能，这意味着其插槽内容将不会移动到任何位置 <!-- 将 class.modal-box 这个HTML 结构 添加到 div#app 子节点下 --> <teleport to="#app"> <div clas
2021-06-12 17:27:54
211
原创 Vue3 组合式API
组合式 API 基础（就是将一个组件中的不同逻辑分离开来，放在不同的js文件中，再引入，使用者不需要知道怎么实现，只需要知道提供了哪些功能）setup 组件选项新的 setup 选项在组件创建之前执行，一旦 props 被解析，就将作为组合式 API 的入口。setup 中避免使用 this , setup的调用 在 data 、methods、computed 解析之前setup 选项是一个接收 props 和 context 的函数将setup 返回的函数 暴露给 组件的其余部分 （计
2021-06-12 14:17:30
806
原创 uni-app 预览pdf文件
uni-app 预览pdf文件有一个不下载文件，预览文件的需求，一开始是要求能够预览word文档，但是这个文档只是用来观看的，不需要进行任何修改操作。为啥不预览pdf呢（其实是我菜，没办法做到在线预览word文档，甚至编辑）在网上查看了很多资料，uni-app也看到了一些插件（付费的），实际我这项目是完全没必要预览word的，pdf足够，只是单存的展示一个文件内容。解决方案pdfjs （不推荐）将pdfjs 文件下载下来拷贝到项目中，光这个pdfjs文件就有11~12M大小。只支持H5，
2021-06-11 16:46:58
17519
5
原创 js中 `?.` 可选链操作符与`??` 空值合并运算符 的用法
?. 可选链操作符通过连接的对象的引用或函数可能是 undefined 或 null 时，可选链操作符提供了一种方法来简化被连接对象的值访问。可选链不能用于赋值 let obj = { name:'xxx', addr:{ city:'', }, age:[18,19] } // 访问一个不存在 属性 报错 let town1 = obj.addr.town; // 常规写法 let town11 = obj.addr &.
2021-06-10 15:51:25
5683
原创 vue3注册使用路由，及常用api变更详情
vue3 填坑指南使用 vue-router@4 (vue3注册使用路由)new Router 变成 createRouter// 以前是// import Router from 'vue-router'// 现在是 import { createRouter } from 'vue-router'const router = createRouter({ // ...})新的 history 配置取代 modemode: 'history'配置已经被一个更灵活的 h
2021-06-07 17:44:15
660
原创 一些小知识及git 使用方法
取消全局的log打印在开发的时候，我们经常会log输出调试程序，在将程序打包的时候可能会忘记删除，导致在正式上线的时候，控制台会输出一些东西 // 设置 开发/生产 环境变量 。在入口程序中对其判断，并重写 console.log 方法 使其不再输出。 // 测试阶段 $config.debug = true; if (!$config.debug) { // 取消日志打印功能 console.log = () => { } }Vue.confi.
2021-06-01 17:33:59
180
原创 uniapp判定 用户 是向左滑还是向右滑
一个简单组件<template> <view class="wrapper" @touchstart="fingerstart" @touchend="fingerend"> <slot></slot> </view></template><script> export default { name: "swipe-direct-com", data() { return { // 记录开始位
2021-05-29 10:01:05
2060
原创 uniapp 踩坑记录
踩坑自定义vue 组件不可以使用 页面的生命周期?使用不同的 dcloud 账号 需要重新获取 appid（应用程序的唯一标识），appid 更换后，之前安装的应用程序是没有办法自动更新的，会生成两个APP如果使用的 Android 证书不同，appid 一样,会导致无法安装。plus.runtime.version获取版本号，只有经过云打包后才会生效，所以在本地获取与设置的可能有出入 可以通过plus.runtime.getProperty的方式来获取应用信息获取 uniapp 中的节点设置样
2021-05-28 15:36:32
2414
原创 uni-app 学习之路
uni-app APIonShareAppMessage生命周期中的分享，自带原生分享onShareTimeline自定义分享onReachBottom下滑到页面底部触发，一般用于继续获取数据setNavigationBarTitle设置标签页标题navigateBack关闭当前页面，返回上一页面或多级页showToast轻提示navigateTo跳转到应用内的某个页面，保留原有页面setStorage将数据存储到本地中，会覆盖原有相同key（异
2021-05-26 16:48:56
1379
转载 requestAnimationFrame详解
requestAnimationFrame详解https://www.jianshu.com/p/fa5512dfb4f5添加链接描述
2021-04-28 20:49:49
489
原创 watch 绑定监听立即执行 / computed 计算属性传参 / router 传值
最近公司需要一个新的中后台系统，打算使用一下新的UI组件 使用 Ant Design Vue ，直接使用了 Ant Design Vue Admin 。对于我这种刚入行一年的，看看大佬的代码，实现思路也是一种成长的方式。总结一下新学到的知识和思路问题描述：在modal组件中放了一个组件，父组件传值给子组件，子组件使用watch监听，结果在每次是第一次打开弹窗的时候，watch并不能监听到参过去的参数变化。解决方法使用 $refs.xxx 去调用方法传值。直接使用 Vue 官方提供的.
2021-04-27 20:36:15
938
原创 ES6 static 关键字 及 Symbol.hasInstance 方法
最近又在 复习 js 知识，一遍又一遍，每遍都会有新的知识学到，新的理解。加油~Static静态数据类型，静态方法通常用于创建实用程序函数被 static 修饰过的 属性 和 方法不能被class的实例化对象调用不管在class里面还是class外面,需要通过类名. 属性 / 方法名 的形式调用静态方法调用同一个class中的其他静态方法，可使用 this关键字。静态方法内调用不是静态方法或属性不可以使用 this，this当前指向的是class本身，而不是实例化对象可以被继承，继承.
2021-04-24 21:38:24
354
1
原创 常用的css样式
• 设置 好看的界面样式 box-sizing: content-box; border-radius: 10px; box-shadow: 0 15px 25px rgba(0, 0, 0, 0.5);• 去除input 点击默认框outline: none;box-shadow: none;border: none;超出省略号white-space: nowrap;overflow: hidden;text-overflow: ellipsis;多行超出省
2021-04-22 09:09:00
228
原创 nodejs 使用 fluent-ffmpeg 进行切片，生成m3u8文件，使用Vue-Video-Player 读取视频
https://cloud.tencent.com/developer/article/1524052
2021-04-21 09:16:12
4687
原创 js 超详细的手写call、apply、bind
手写callFunction.prototype.myCall = function (context, ...arg) { // 此时的 this 指向的是小数点前面的变量 也就是 obj.getName // 并将 obj.getName 赋值给 context 的 fn 属性 // 使用 context.fn 执行的时候，this 指向小数点前面的对象 context context.fn = this; let result = context.fn(..
2021-04-10 22:02:41
546
原创 小程序学习查缺补漏
小程序学习全局配置page 中不能有后缀名在微信开发者工具里面 直接新建可以生成一个带有全部文件的文件夹tabbar 中 的颜色设置不能只能为16进制使用 布尔类型充当变量的时候，注意字符串和花括号之间不要存在空格，否则会显示错误的结果wxml<text> 相当于一个span 标签，行内元素，并排显示<view> 相当于一个div 标签，块级元素，会换行<checkbox> 多选wx:for 列表循环可以是对象或数组wx:for-ite
2021-04-06 22:22:43
132
原创 文本转语音的接口（开放免费）
“http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&spd=4&text=你好啊，听起来好憨啊”lan 语言类型lan=en 英文lan = zh 中文ie 文字编码方式spd 语速1-9的数字，数字越大，语速越快。text 要转换的文本...
2021-04-01 17:11:33
19569
13
转载 vue使用recorder.js实现录音功能
https://www.jb51.net/article/174878.htmmounted中需要修改的地方：需要注意的是它使用的 navigator.getUserMedia 已经被废弃了 需要修改为 navigator.mediaDevices.getUserMedia还有 audio_context = new AudioContext; 这句话没有被使用，加上会报错，我把它去掉了，有懂得大佬给解释一下。...
2021-03-25 18:06:41
570
原创 vue将后端获取到的路由，通过 addRouter 动态添加。
获取路由参数，将路由添加到路由集合中去// 获取 路由信息axios.post("/api/mock/getMenu") .then((resp) => { let datas = resp.data; // 遍历获取到的路由数组将其添加到全局路由中 datas.forEach(v => { v.component = routerCom(v.component); // 处理下路径获取 .
2021-03-09 16:53:37
6308
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人