2023年10月9日

客户端简单使用socket.io---vue3全局挂载

摘要: socket.io官网:https://socket.io/ 使用前要先安装socket.io npm i socket.io socketIO.js import io from 'socket.io-client' export default { install: (app) => { if( 阅读全文

posted @ 2023-10-09 14:58 IT丶Hatcher 阅读(1185) 评论(0) 推荐(0)

css自定义滚动条

摘要: .container { width: 200px; height: 150px; overflow: auto; /* 自动显示滚动条 / -ms-overflow-style: scrollbar; / 在IE上显示自定义滚动条 */ } /* 自定义滚动条的样式 */ .container:: 阅读全文

posted @ 2023-10-09 14:39 IT丶Hatcher 阅读(38) 评论(0) 推荐(0)

webpack配置删除console

摘要: 1.删除所有的console.log vue.config.js: module.exports = defineConfig({ configureWebpack: (config) => { // 删除console config.optimization.minimizer[0].option 阅读全文

posted @ 2023-10-09 14:38 IT丶Hatcher 阅读(615) 评论(0) 推荐(0)

2023年5月19日

// 读取url转为base64

摘要: urlContentToDataUri(url) { return fetch(url) .then(response => response.blob()) .then(blob => new Promise(callback => { let reader = new FileReader(); 阅读全文

posted @ 2023-05-19 10:05 IT丶Hatcher 阅读(153) 评论(0) 推荐(0)

2023年5月5日

监听浏览器各个标签间的切换

摘要: document.addEventListener('visibilitychange',function(e){ console.log(document.visibilityState); let state = document.visibilityState if(state == 'hid 阅读全文

posted @ 2023-05-05 17:23 IT丶Hatcher 阅读(66) 评论(0) 推荐(0)

2023年4月11日

点击其他地方移除active 缩起tab选项卡

摘要: HTML: html <div class="tab-group"> <div class="tab">选项卡1</div> <div class="tab-content">选项卡1的内容</div> <div class="tab">选项卡2</div> <div class="tab-cont 阅读全文

posted @ 2023-04-11 17:05 IT丶Hatcher 阅读(19) 评论(0) 推荐(0)

2023年4月7日

使用 window.getSelection() 和 getRangeAt() 方法来获取鼠标光标前的字符串。

摘要: 具体实现方法如下: 给文本输入框或富文本编辑器绑定 mouseup 事件,监听鼠标松开的动作。 在事件处理函数中,先判断当前文本框是否获得了焦点(即用户在此次点击之前,已经在该文本框内部输入过字符)。 如果已经获得了焦点,则获取当前选区(Selection)对象。 利用 getRangeAt() 方 阅读全文

posted @ 2023-04-07 11:31 IT丶Hatcher 阅读(1548) 评论(0) 推荐(0)

2023年4月4日

vue做播放器和进度条

摘要: <template> <video-player class="video-player vjs-custom-skin" ref="videoPlayer" :playsinline="true" :options="playerOptions" @play="onPlayerPlay($even 阅读全文

posted @ 2023-04-04 10:15 IT丶Hatcher 阅读(780) 评论(0) 推荐(0)

2023年3月24日

俩个数组中找出相同的元素,并添加样式

摘要: result.Tags.tags.forEach((item,index)=>{ let idx1 = result.Tags.lightHighArr.indexOf(item) let idx2 = result.Tags.wordArrAppend.indexOf(item) if(idx1 阅读全文

posted @ 2023-03-24 11:12 IT丶Hatcher 阅读(26) 评论(0) 推荐(0)

css实现只显示3行,剩余部分省略

摘要: display: -webkit-box; -webkit-line-clamp: 3; /* 显示行数 */ -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; border: 1px solid #cc 阅读全文

posted @ 2023-03-24 09:51 IT丶Hatcher 阅读(564) 评论(0) 推荐(0)

导航