![](https://img-blog.csdnimg.cn/20210126140200898.jpg?x-oss-process=image/resize,m_fixed,h_224,w_224)
前端开发相关
文章平均质量分 51
本专栏为个人开发工作中遇到的一些问题及解决方案的展示。
hoaxxcj
主要从事前端网页开发。
展开
-
Node.js初学心得
首先创建一个文件夹,我命名它为nodeTest,然后在文件夹路径打开powershell终端,输入“cnpm install express --save"或"npm install express --save”安装Express依赖。做vue前端开发,node环境很早就知道,之前想当然认为node就是一个常规的运行环境,不会提供其它功能。另外,我发现node.js里面的console.log不会打印到浏览器控制台,而是powershell里面,可能是因为它是在服务内,不是在系统内。原创 2024-02-23 08:59:32 · 421 阅读 · 0 评论 -
微前端个人理解与简单总结
我研究、配置的第一个微前端是qiankun,根据qiankun官方文档可以成功搭建Vue主子应用以及react子应用,但文档中配置项层级模糊且对应示例比较片面,好在网上博客、文档多。最近一段时间在学习微前端,一开始是看各种博客了解微前端含义、对比多种微前端框架优劣,最后选择了qiankun、micro-app、wujie这三种微前端框架进行深入研究、对比。可以说wujie给我最大的感觉是文档混乱、步骤不清晰、容易误导人,网上相关的博客、文档很少,翻来覆去内容都很相似,参考意义不大。Qiankun(蚂蚁)原创 2023-12-01 11:22:46 · 2123 阅读 · 0 评论 -
浙政钉二维码控制显示及缩放
response_type=code&client_id=应用标识&redirect_uri=回调地址&scope=get_user_info&authType=QRCODE&embedMode=true。//数据格式:{ "code": "aaaa", "state": "bbbb" } alert(JSON.stringify(event.data));注意事项:参数"redirect_uri=回调地址"涉及的域名,需和创建扫码登录应用授权时填写的回调域名一致,否则会提示无权限访问。原创 2023-12-01 10:19:51 · 727 阅读 · 0 评论 -
Vue项目接入海康威视智能应用平台监控摄像头全过程分享
、原创 2023-04-14 16:31:11 · 9786 阅读 · 13 评论 -
一些常用JQuery语句转为基于Vue的HTML原生写法汇总
一些常用JQuery语句转为基于Vue的HTML原生写法汇总原创 2022-09-07 14:01:05 · 779 阅读 · 0 评论 -
Vxe-table使用技巧总结
最近项目中需要用到多层树table+checkbox勾选功能,选了一些组件,最终决定使用vxe-table。Vxe-table功能丰富、api也多。官方例子很多比较粗浅,我花了很多精力才弄通了一些功能点及细节。在此汇总给大伙铺铺路。原创 2022-06-01 16:08:25 · 19254 阅读 · 0 评论 -
原生input标签滑块功能及样式修改实现
现在很多现成的前端组件非常受欢迎,以至于越来越多的HTML原生标签渐渐被忽视。但现成组件功能局限性较大,有些情况下无法支撑实际的需求,这时候还是得靠HTML原生标签实现。最近参与玄览组件开发时就遇到了这种情况:有多个滑动条,它们分别对应一个或多个图层,移动滑动条时要能实时修改对应图层的透明度,并且要修改滑动条样式。常见的一些现成滑块组件样式修改容易,但提供的属性值和绑定的方法只适用单个滑块使用场景。在多滑块相互影响、联动的场景面前显得捉襟见肘,并且有时候该滑块对应功能限制了滑块使用方式。比如超图原创 2021-12-02 15:15:43 · 2072 阅读 · 0 评论 -
Canvas动态改变宽高解决拉伸问题
之前开发模型渲染功能时,有一个特效是通过给目标canvas添加、修改filter属性实现。当时我发现一个问题:仅仅添加、修改filter一个属性后,canvas内容会被拉伸,导致滚动条出现(如下图,外层div宽高为337.5*745,但内层canvas宽高却为1012*2235),就算添加固定高度也没效果。昨天处理移动端适配,发现这个问题在移动端影响更大。最终我是通过动态改变canvas宽高完美解决了此问题。首先使用window.getComputedStyle()方法获取canvas父级容器宽高;原创 2021-05-19 13:57:10 · 2499 阅读 · 0 评论 -
Vue项目中使用sortablejs实现拖放排序功能
首先通过npm install sortablejs --save在项目中安装依赖;然后在想要实现该功能的页面中引入它:最后,在当前页面中定义rowDrop方法(可以在mounted生命周期触发它或在一个监听函数中触发它,我是后者),我是想在antd的table组件中使用该功能,由于要拖放排序的是tr元素,所以选择tbody元素作为目标节点,即dragTr。接着通过new Sortable()方法传入dragTr完成sortable对象的构建,可以在该方法中传入相关配置项(具体见官网),以及在o原创 2021-04-28 15:33:30 · 1710 阅读 · 1 评论 -
CSS使用注意事项之word-break
有一次我发现无论怎么设置都无法实现行内文字换行,当时我测试的文字是一段很长的纯数字,比如11111111112222222222......888888888899999999999。后来是加了word-break:break-all;才实现。原来网页在识别连续纯数字或连续多个字母时会将其作为一个长单词,需要用word-break:break-all;将其分开。...原创 2021-04-13 15:12:37 · 174 阅读 · 0 评论 -
Vue项目中使用gif.js方法及注意事项
前言:最近遇到一个需求,要将canvas转换成gif动图。网上大部分解决方案是利用gif.js(官方地址:https://github.com/jnordberg/gif.js)。由于没有现成的npm库,官网说明只能直接引入js。由于每个Vue项目用的版本不同,静态资源存放路径也不同,所以我就以Vue2.0为例教大伙正确引入gif.js及gif.worker.js。首先,在项目index.html文件中引用外部js<scripttype="text/javascript"src="ht..原创 2021-04-12 16:28:31 · 3969 阅读 · 8 评论 -
CSS实现区域(局部)可点击
前言:项目采用antd的table组件,鼠标点击每行tr会进行跳转。最近遇到一个需求:table组件在进行多选时,鼠标能正常勾选,但点击绿色箭头所指区域时不做跳转。可以将绿色箭头所指标签添加pointer-events: none样式,再给红色箭头所指标签添加pointer-events: fill样式实现,见下图。...原创 2021-03-26 16:15:15 · 816 阅读 · 0 评论