- 博客(14)
- 收藏
- 关注
原创 使用SortableJS完成双列表拖拽排序
使用SortableJS完成双列表拖拽排序dataInit这个函数加上项目的接口,然后根据项目具体需求和字段分为两个list进行显示。这里需要注意init这个函数,需要放在 mounted 里面调用确保能拿到具体的元素。sort:排序 // 排序1开始,0为不显示也可以不要flag,根据具体需求来。公司项目需要一个可以自定义表头的需求:拖拽实现排序和是否显示。cloneDeep是我写的一个深拷贝函数,网上一大堆就不放了。如果是组件动态显示的话要渲染之后再去调用。两个列表分开展示需要显示的和不显示的。
2023-04-17 09:23:18
1423
原创 WebRTC 如何推送本地视频流
使用 webrtc 协议做直播,常见的音视频源是摄像头和麦克风,高级一点的就是桌面分享。虽然使用桌面分享可以实现推送本地流(原理就是对屏幕录制),但依赖本地播放器,并且观众可以看到主播的任何操作。使用webrtc协议,大多数情况是在浏览器中做主播端。众所周知,出于安全和隐私的原因,Web 应用程序不能直接访问用户设备上的文件。出于安全和隐私的原因,Web 应用程序不能直接访问用户设备上的文件。如果需要读取一个或多个本地文件,可以通过使用。需求,需要将本地视频无感知推送给用户,让用户感觉就像直播一样。
2022-08-23 17:24:50
3110
1
原创 正则的常用方法
1、exec() 方法是一个正则表达式方法,用于检索字符串中的正则表达式的匹配。函数返回一个数组中,其中数组中存放匹配的结果;如果未找到匹配,则返回值为null。2、test() 方法是一个正则表达式方法,用于检测一个字符串是否匹配某个模式,如果字符串中含有匹配的文本,则返回true,否则返回false。3、search() 方法用于检索字符串中指定的子字符串,或检索与正则表达式相配的子字符串,并返回子串的起始位置。3.1、search() 方法使用正则表达式,使用正则表达式搜索字符串,且不区分大小写3.2
2022-06-13 09:18:36
247
原创 H5移动端console.log调试
最近在开发h5,发现一个非常不方便的问题,就是调试h5在手机上查看,没有查看log,所以就会出现一些问题,你不知道怎么问题出现在哪个地方,没有办法通过log来查看,当然,有人可能会说用web浏览器自带的移动端调试工具,或者用小程序开发工具调试,起初我也是这么想的,直到我遇到一个解决视频自动同时播放的需求,发现浏览器的内核不同,导致对一些功能性的api支持也不相同,说白了,就是有些东西,在web移动端调试是可以的,但是手机浏览器实际运行是不行的,尤其是微信浏览器这个反人类的x5内核。 针对这个情况的解决办法
2022-04-11 10:30:15
2336
原创 H5 移动端 console.log 调试
最近在开发h5,发现一个非常不方便的问题,就是调试h5在手机上查看,没有查看log,所以就会出现一些问题,你不知道怎么问题出现在哪个地方,没有办法通过log来查看,当然,有人可能会说用web浏览器自带的移动端调试工具,或者用小程序开发工具调试,起初我也是这么想的,直到我遇到一个解决视频自动同时播放的需求,发现浏览器的内核不同,导致对一些功能性的api支持也不相同,说白了,就是有些东西,在web移动端调试是可以的,但是手机浏览器实际运行是不行的,尤其是微信浏览器这个反人类的x5内核。 针对这个情况的解决办法
2022-04-11 10:25:52
3315
原创 富文本插件 quill
<template> <div> <el-upload :action="uploadUrl" :before-upload="handleBeforeUpload" :on-success="handleUploadSuccess" :on-error="handleUploadError" name="file" :show-file-list="false" :headers.
2022-01-25 09:18:47
2268
原创 flex布局语法
文章目录系列文章目录 前言 一、pandas是什么? 二、使用步骤 1.引入库 2.读入数据 总结前言弹性盒子是css3的一种新的布局模式。随着浏览器的发展,flex(弹性盒子)目前已经得到所有浏览器的支持。相对于传统的布局display+position+float而言在一些特定情况flex有着天然的优势,比如垂直居中。所以在面试时flex会是css的重点,一、flex是什么?flex是Flexible Box的缩写,为弹性盒子flex(弹性盒子)是...
2022-01-04 14:15:49
544
原创 elementUI+vue.js 实现图片上传
前端使用的是vue.js和element-ui。上传是包含在一个表单里面,使用element-ui的upload上传组件,上传图片地址是后端提供的接口并返回一个上传后的图片地址用于写入并绑定数据库action :上传地址list-type:上传的按钮样式,根据需求调整auto-upload :是否在选取文件后立即进行上传 这里关闭 auto-upload 后方便调取接口 就不必使用action的地址了multiple : 是否支持多选文件on-change : 文件状态改变时..
2022-01-01 17:10:14
1080
原创 文字超出部分显示...
实现单行文本溢出部分显示 …注意有些场景需要设置宽度并设置为display: block;或者display: inline-block;div { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}实现多行文字超出显示...-webkit-line-clamp: 2; 这个是控制最多显示几行div { overflow: hidden; text-overflo
2021-12-31 12:09:41
1266
原创 css小手样式
css的cursor属性可以定义鼠标显示不同的光标class { cursor: pointer; //小手样式}默认值是autourl:自定义光标的地址(URL) 通常需要在后面定义一个默认光标 防止URL地址出错default 默认光标(箭头)auto 浏览器设置的光标crosshair 十字线pointer 小手move 提示可移动e-resize 提升可被向右移动ne-resize 提示可被向上和向右移动nw-resize ...
2021-12-31 11:52:47
2675
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人