- 博客(151)
- 收藏
- 关注
RSS订阅原创 formData 传参 如何传数组
HTTP协议本身不支持数组传输，但可通过三种方法实现：1)重复键名，后端自动解析为数组；2)转为JSON字符串，需后端手动解析；3)使用逗号分隔字符串，后端需拆分处理。这三种方式都能解决HTTP表单传递数组的问题，开发者可根据项目需求选择合适方案。
2025-11-28 18:25:02
321
原创 使用 ＜video＞ 标签中的 controls 和 controlslist 属性
本文介绍了HTML5视频标签中的两个重要属性：controls和controlslist。controls属性用于显示浏览器默认的视频控制条，包含播放/暂停、音量调节等功能。controlslist属性则允许开发者定制控制界面，通过nodownload、nofullscreen等参数禁用特定按钮。两者的结合使用既能提供基础播放功能，又能实现更精细的界面控制，优化用户体验。文章通过代码示例展示了这两个属性的具体应用场景和实现方法。
2025-11-27 11:14:46
431
原创 vue3进行跳转路由打开新的标签页。
本文介绍了在Vue3中使用VueRouter和window.open()实现新标签页打开的方法。通过组合router.resolve()获取路由的完整URL，再配合window.open()的'_blank'参数，可以方便地在点击按钮时在新标签页打开指定路由页面。代码简洁明了，适用于需要在新标签页打开Vue路由页面的场景。
2025-11-04 15:03:10
244
原创 navigator.clipboard.writeText(str)将文本 str 写入系统的剪贴板。
摘要：navigator.clipboard.writeText()是浏览器提供的剪贴板API，用于将文本内容写入系统剪贴板。该功能常用于复制按钮、文本编辑器和社交媒体分享等场景，通过简单的代码即可实现文本复制功能。示例代码展示了如何创建复制按钮，包括成功和错误的回调处理。使用时需要注意浏览器兼容性和用户权限问题。该API为网页提供了更便捷的剪贴板交互方式。
2025-10-30 11:26:27
261
原创 input 标签的宽度根据内容自动调整
本文介绍了一种基于JavaScript的输入框宽度自适应内容方案。通过监听输入事件，临时将输入框宽度设为auto获取内容真实宽度(scrollWidth)，再将该宽度赋给输入框，实现内容增减时宽度实时跟随。Vue3实现中，使用ref获取DOM引用，通过adjustWidth方法动态调整宽度，并考虑2px缓冲避免文字贴边。组件挂载时初始化宽度，确保样式box-sizing不影响计算。此方案简洁高效，适用于需要动态调整输入框宽度的场景。
2025-08-18 12:00:57
382
原创 以下是几种常用的 CSS 方法，可以确保容器保持最小尺寸，不会被邻近元素过度压缩：
CSS设置元素最小尺寸的方法：1. 使用min-width/min-height直接设置最小宽高；2. 在Flex布局中通过flex-basis设置初始尺寸，flex-shrink:0防止收缩；3. 在Grid布局中使用minmax()函数，设置最小200px最大1fr的列宽。三种方法都能有效控制元素的最小显示尺寸。（98字）
2025-07-07 15:15:48
273
原创 ＜teleport＞ 是 Vue 3 引入的一个内置组件，用于在 DOM 中移动组件的渲染位置，但保持组件的逻辑作用域不变
Vue3的<teleport>组件允许将内容渲染到DOM任意位置，同时保留原组件逻辑。它通过to属性指定目标位置（如"body"），主要解决层级冲突问题（如模态框被父容器样式限制）。典型应用包括：将对话框移到body下避免z-index冲突，或分离复杂弹出层提升代码可读性。该功能简化了需要脱离父容器渲染的组件开发，保持状态管理的同时实现视觉层自由定位。
2025-06-13 12:23:53
477
原创 html - ＜mark＞标签
HTML中的<mark>标签用于高亮文本内容，默认显示为黄色背景。主要用途是在搜索结果或重要文本中突出显示关键信息。可通过CSS自定义其样式。
2025-06-05 11:54:27
615
原创 html-＜abbr＞ 缩写或首字母缩略词
<abbr>标签的作用是标记网页中的缩写或首字母缩略词，并通过title属性提供完整解释。当用户鼠标悬停在缩写上时，浏览器会显示提示框展示完整含义。示例代码中，将"HTML"和"CB"分别标记为缩写，并关联了它们的全称"Hypertext Markup Language"和"CodingBeauty"，帮助用户理解这些专业术语。
2025-06-05 11:46:30
460
原创 html-pre标签
<pre>标签的作用是保留文本格式（空格、换行等），常用于展示代码。与普通标签不同，它能显示原始排版（如连续空格），适合呈现需保持格式的内容。示例：<pre>文本会保留 空格 和 换行</pre>。
2025-06-05 11:00:06
696
原创 Vue 3 动态 ref 的使用方式（表格）
在开发表格组件时，遇到一个视频上传功能的问题：当表格有多行数据时，点击某一行的上传按钮并选择文件后，数据总是被绑定到最后一行，而非目标行。为解决此问题，采取了以下步骤：首先，创建了一个inputRefs对象来存储每行input元素的引用；其次，在模板中通过ref绑定将每行的input元素与对应的行ID关联；最后，通过行ID获取对应的input引用并触发点击事件，确保文件上传功能正确绑定到目标行。这一方法有效解决了数据绑定错误的问题，提升了用户体验。
2025-05-18 19:02:12
860
1
原创 组件通信-provide、inject
子组件：注意：子组件中不用编写任何东西，是不受到任何打扰的。孙组件：【第二步】孙组件中使用。【第一步】父组件中，使用。配置向后代组件提供数据。
2025-05-02 21:15:48
412
原创 组件通信-自定义事件
事件名是任意名称 （建议肉串命名 ：send-toy）注意区分好：原生事件、自定义事件。: 是包含事件相关信息的对象（自定义事件：常用于 子>父。
2025-05-02 13:35:09
576
原创 同步和异步解释
同步：任务按顺序执行，后一个任务等待前一个任务完成，适合简单的、没有依赖其他操作的场景。异步：任务可以同时进行，不会阻塞其他任务，适合需要等待的操作，提升应用的响应性和性能。
2025-04-21 12:15:21
124
原创 Vue3中的watch
特点：只能监视以下四种数据：ref定义的数据。reactive定义的数据。函数返回一个值（getter函数）。一个包含上述内容的数组。
2025-04-20 16:58:01
686
原创 vue3 toRefs 与 toRef的使用
当对响应式对象进行解构操作时，解构出来的属性会失去响应性。当你仅需对响应式对象中的某一个属性创建引用时，可以使用。创建的响应式对象的每一个属性，转换为。上，反之亦然，它们都能保持响应式更新。就能保证解构后的属性仍然保持响应性。所获取的值是相同的，并且对。进行修改会同步反映到。作用：与toRefs一致。
2025-04-20 12:04:00
271
原创 vue中的css深度选择器v-deep 配合!important
当标签有scoped属性时，它的 CSS 只作用于当前组件中的元素，父组件的样式将不会渗透到子组件。 如果你希望 scoped 样式中的一个选择器能够作用得“更深”，例如影响子组件，你可以使用深度选择器。v-deep 配合!important
2024-12-23 20:27:44
560
原创 uniapp 如何自定义导航栏并自适应机型
在设计页面顶部导航栏时，可以根据safeAreaInsets.top的值来调整导航栏的位置，使其在不同设备上都能正确显示，避免被刘海区域遮挡。
2024-09-14 14:45:24
1945
原创 uniapp 微信小程序，在ios手机会出现页面左右滑动,安卓机不会
1、首先找到这个页面，一个盒子一个盒子的注释，然后保存看页面，哪个盒子显示导致出现横向滚动条，就找到了这个盒子。3、或者这个盒子加了内外边距，但没有添加box-sizing:border-box;4、或者这个盒子加了轮播或者滑动，没有添加溢出隐藏 over-flow:hiden;出现滑动，其实就是盒子溢出了，修改一下样式就行了。安卓机会自己适配，所以没有这个问题。2、这个盒子的样式，看是否没有定宽，width:100%;
2024-08-25 11:09:50
963
1
原创 uni-app里引入阿里彩色矢量图标(Symbol),却发现图标显示为黑白
当使用uniapp并尝试引入阿里iconfont的彩色图标时，发现图标显示为黑白。原因是Fontclass模式不支持彩色图标。解决方法是下载Symbol模式的SVG文件，使用iconfont-tools进行转换，然后在项目中全局引入转换后的CSS文件，最终在组件中正确显示彩色图标。
2024-08-25 11:05:28
1785
1
原创 es6 扩展运算符
注意，如果对象有相同的属性，后面的对象的属性会覆盖前面的对象的属性。扩展运算符可以用于创建对象的浅拷贝，即复制对象的属性到一个新的对象中。扩展运算符可以用于将对象的属性展开为函数的参数。可以使用扩展运算符将多个对象合并成一个对象。
2024-08-18 13:38:25
479
原创 es6 的解构赋值
对象的解构与数组有一个重要的不同。数组的元素是按次序排列的，变量的取值由它的位置决定；字符串也可以解构赋值。这是因为此时，字符串被转换成了一个类似数组的对象。上面代码表示，可以从数组中提取值，以前，为变量赋值，只能直接指定值。ES6 允许写成下面这样。如果解构失败，变量的值等于undefined。
2024-08-18 12:56:10
423
原创 js中闭包的理解
答：在一个外部函数内部定义了一个内部函数，并且内部函数可以引用外部函数的局部变量，那么这个函数就是一个闭包。解决方法——使用完变量后，手动将它赋值为null；简单理解：闭包 = 内部函数 + 外部函数的变量。
2024-07-12 10:44:23
506
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人