自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

廖若星辰-LTY

吾尝终日而思矣,不如须臾之所学也。

  • 博客(83)
  • 收藏
  • 关注

原创 将本地项目保存到 GitHub 上的操作步骤

项目开发完毕后为了防止项目异常遗失或方便分享使用最好是保存一份备份到 GitHub 上,这样一是防止本地项目的遗失和代码的异常修改,二是可以随时通过远程联网的形式将存储在 GitHub 上的项目克隆到本地或分享给他人,这样的 GitHub 就像一个随时随身携带的 U盘 一样,只要有网络我们就能很方便的找到自己的项目记录打开自己的项目库,这样的功能对程序员简直不要太香!下面直接梳理本地项目保存到 GitHub 上的操作步骤:1.打开网页进入 GitHub 官网,登录个人账号,进入到个人信息中心,或点击

2021-09-28 19:08:37 717

原创 前端 js + qrcode 根据指定内容生成二维码图片路径方法封装

前端 js + qrcode 根据指定内容生成二维码图片路径方法封装 vue 代码示例 返回 base64 格式图片

2024-04-08 10:00:41 211

原创 Flutter底部导航栏插件persistent_bottom_nav_bar的使用

flutter 框架中的persistent_bottom_nav_bar 插件可以让我们快速实现页面底部导航栏(也就是 bottomNavigationBar )的布局且能拥有多样的切换效果(包括但不限于:动画切换效果、中间凸起按钮效果等)

2024-01-23 01:32:15 717

原创 uniapp 适配部分IPhone手机底部安全距离

部分 IOS 机型,比如 Iphone X 的屏幕底部有一条“小黑线”区域,uniapp 项目中我们可以使用CSS的env(safe-area-inset-bottom) 语句来自适配 IOS 的底部安全区域高度,这个语句会返回该机型的底部安全区域高度(单位 px)。

2023-11-23 15:03:31 1787

原创 uniapp vue2、vue3 页面模板代码块设置

uniapp vue2、vue3 页面模板代码块设置

2023-10-27 18:01:26 727

原创 git 提交时屏蔽本地无需上传的文件

当我们在使用 git 提交代码到远程代码仓库时,项目中总有一些文件是数据量很大且无需上传的,这时我们可以在项目根目录中通过 .gitignore 文件屏蔽这些无需上传的文件,这样可以大大缩短我们代码的提交时间且腾出远程仓库更多的空间。

2023-09-24 12:03:18 542

原创 uniapp 拉起微信支付方法封装

​基于 uniapp 的 uni.requestPayment() 微信支付拉起方法封装及调用示例uniapp 微信支付 uni.requestPayment 方法​

2023-09-20 11:54:39 273

原创 uniapp 自定义手机顶部状态栏(适配状态栏高度)

uniapp 在pages.json页面设置了全局的的或单页面的style的之后页面顶部就没有自带的导航栏了,这时用户可自定义该页面的顶部导航栏。uniapp 自定义页面状态栏

2023-08-21 12:03:02 2591

原创 前端打开后端返回的HTML格式的数据

前端打开后端返回的 HTML格式 的数据

2023-08-15 18:25:22 1791

原创 网站窗口标题旁的图标生成与替换

电脑端浏览器打开网站后窗口顶部的标签标题左边会有一个网站图标的显示,那个图标需要的是。只需要打开网址选择文件、选择尺寸生成下载,然后放到个人项目中(一般。),然后在项目根目录的。

2023-07-13 13:55:52 205

原创 uniapp 封装将网络路径图片保存至相册的方法

获取图片信息(从而获取图片本地路径)- 保存图片到系统相册。

2023-07-07 14:27:02 1369

原创 纯 HTML + CSS 实现圆形 loading 动画效果

使用纯 HTML + CSS 实现圆形 loading 加载动画效果

2022-12-12 19:33:01 1250 1

原创 纯 HTML + CSS 实现 input placeholder 过渡效果

记录前端使用纯 HTML + CSS提示文本上下移动的过渡效果核心概要:CSS的 pointer-events: none; 样式可以使一个元素不响应点击事件变得不可点击从而充当 input 的placeholder 时不会影响 input 的正常点击获取焦点事件;input 元素添加 required 属性后,如果输入框中的值是合法的,则 CSS 中的.input:valid 选择器能被匹配。

2022-12-11 22:57:08 575

原创 Vue3 异步组件使用示例

将项目中不常用的组件以异步组件形式导入使用是我们项目优化的一个步骤,异步组件的代码项目打包时是分开打包的,能形成一个“分包”的机制,从而缩短项目的首次加载时间,提升用户体验,这里记录下 Vue3 中异步导入组件的使用示例:

2022-12-07 23:54:20 372

原创 ? 可选链操作符以及 ?? 与 || 的区别

?是可选链操作符,常用于访问引用类型具有不确定性的内部数据时,比如要访问一个对象中的数组,不确定数组一定有数据就可以使用 ? 取读取它的 length 属性,如果对象没有这个属性也仅会返回 undefined 而不会报错,这样可以有效规避“undefuned上没有 length 属性”的报错!代码示例:?? 和 ||?? 和 || 运算符都可以用于设置“默认值/备用值”的情况,但二者具有些微差别:?? 运算符仅有在左侧数据为 undefined 或 null 时才会取右侧的值,所以左侧数据为 0

2022-12-07 23:24:24 311

原创 HTML + CSS 实现矩形/圆形进度条效果 - SVG

通过 HTML + CSS + 部分原生 JS 使用 SVG 嵌入 HTML 文档的用法实现常见的圆形和矩形进度条效果(实际运行效果是进度条从 0 过渡到一个目标值比如 100%)

2022-11-30 15:30:14 1589

原创 React Router 6 快速上手

React Router 6 是 react-router-dom 的 v6 版本,此版本已是 create-react-app 创建 react 项目时的默认版本,本文主要记录 v6 版本的基本使用以及常用 API,会与 v5 做一些比较:更多详情请查阅:React Router 中文文档如果项目中还没有安装 React Router 则可以进行如下 NPM 安装,默认安装的就是 v6 版本

2022-11-28 19:25:59 1314

原创 Vue3 Pinia 全局状态管理工具的使用

是 Vue3 官方更推荐使用的全局状态管理工具。Pinia 最初正是为了探索 Vuex 的下一个版本而开发的,因此整合了核心团队关于 Vuex 5 的许多想法。最终,我们意识到 Pinia 已经实现了我们想要在 Vuex 5 中提供的大部分内容,因此决定将其作为新的官方推荐。——摘自本文主要记录在 Vue3 项目中使用 Pinia 的步骤,首先更多关于 Pinia 使用的规则介绍建议查阅。

2022-11-26 15:20:58 1011

原创 Vue3 按需引入 Element Plus

Vue3 按需引入 Element Plus ​在 Vite 创建的 Vue3 项目框架中从0开始安装配置按需引入Element Plus 的步骤,注:以下配置的示例为 Vite 构建的 Vue3 脚手架项目​

2022-11-25 00:08:29 3258

原创 vue3 + TS 自定义插件-全局message提示插件示例

本文记录 Vue3 + ts 实现自定义一个全局插件,用于进行 message 消息提示,所谓全局插件即挂载到 vue 实例上,在 App 的任一子组件中均可通过 app 的实例调用该方法。消息提示功能只是示例主要是记录 Vue3 自定义插件功能的写法。

2022-11-09 01:36:25 3960 4

原创 vue3 + ts 通过自定义指令实现可以自由拖动的盒子

本文主要记录 vue3 自定义指令的用法的一个案例,通过自定义指令实现一个盒子(类似弹框)可以被鼠标在浏览器的可视区域内自由拖动:

2022-11-08 20:40:41 1116

原创 Vue Transition 过渡组件 + animate.style 动画库的使用

Vue 提供了 transition的封装组件,可以给被包裹的任何元素和组件添加进入/离开过渡效果。

2022-10-27 16:09:15 1123

转载 Vue3 的生命周期函数

此时内存中的数据已经被修改,但还没有更新到页面上,可以访问到旧的DOM。,用于跟踪所有响应式变量和方法,一旦页面有 update ,就会跟踪他们并。,与 keep-alive 一起使用,当 keep-alive 包裹的。,与 keep-alive 一起使用,当 keep-alive 包裹的。,此时内存数据已经修改,页面数据也已经更新,可以访问到新的DOM。,状态触发,同样是vue3新引入的钩子函数,,状态跟踪,vue3新引入的钩子函数,,挂载完成后调用,此时。,卸载组件实例后调用。

2022-10-25 23:44:42 2250

原创 uniapp 前端获取微信小程序 URL Link (HTTPS调用)

已将获取小程序指定页面 https 短链的核心业务封装为 getAppLink() 方法,可直接复制使用,注意该方法发起网络请求的方式是。,本文主要是记录前端自行生成小程序指定页面 https 短链的方法。:微信小程序此前可以在小程序管理后台-工具 中直接快捷生成小程序指定页面的 https 短链,后。方式,并封装了将小程序指定页面直接转换为 https 短链的方法。前端基于 uniapp 获取微信小程序 URL Link 短链,获取小程序 URL Link 的。方法中使用到的小程序的。

2022-10-09 14:43:56 6584 1

原创 uniapp 为项目配置分包

uniapp 分包 小程序 分包配置 步骤 分包优化

2022-10-09 11:30:46 1666

原创 uniapp 微信小程序版本更新后自动触发提示并更新

uniapp 微信小程序版本更新后自动触发提示并更新

2022-10-08 18:58:42 207

原创 React-路由 react-router-dom

React 路由 react-router-dom BrowserRouter Routes Route Link useNavigate useSearchParams useParams useRoutes 声明式导航 编程式导航 路由传参 默认路由 路由嵌套

2022-08-25 13:03:15 6398

原创 React-hooks

React hook hooks useState useEffect useRef useContext

2022-08-24 22:30:36 221

原创 React-组件生命周期

React 组件生命周期 挂载 更新 卸载 constructor render componentDidMount componentDidUpdate componentWillUnmount

2022-08-24 18:18:03 325

原创 React-组件-props 校验 类型 是否必填 默认值

React 基础 组件 props 校验 类型 是否必填项 设置默认值 PropTypes prop-types isRequired defaultProps

2022-08-24 17:06:20 1457 1

原创 React基础-组件通信

React 基础 组件通信 父传子 子传父 兄弟组件互传 跨组件通信 Context Provider 和 Consumer 对象

2022-08-24 16:19:44 121

原创 uniapp-移动端实现购物车左滑删除的UI和事件处理

uniapp 移动端 小程序 微信小程序 购物车左滑 删除 手指触摸屏幕事件 手指移动事件 手指离开屏幕事件

2022-06-13 17:03:11 1918 1

原创 uniapp 图片裁剪插件推荐

uniapp 微信小程序 图片裁剪 上传头像 固定图片大小 等比例缩放 轻量级 实用 高效 推荐裁剪工具

2022-04-01 14:29:48 4242 7

原创 uniapp-上传图片、上传视频

uniapp 微信小程序 上传图片 上传视频 上传媒体文件 uni.chooseImage uni.chooseVideo uni.uploadFile uni.chooseMedia

2022-03-16 16:25:15 19290 3

原创 腾讯云即时通讯IM前端使用步骤简述

腾讯云 即时通讯 IM uniapp-微信小程序 客户端接入步骤/流程为项目接入腾讯云即时通信

2022-01-22 16:31:21 6601

原创 JavaScript 封装格式化时间戳的函数

日常项目开发中把一个时间戳(如何获取时间戳?格式化为日常生活中正常常见的时间格式的业务是很常见的。这里封装了一个基础的格式化时间的函数供您参考。这个函数接收一个 10 位或者 13 位的时间戳(不传会默认当前时间),返回一个时间戳格式化后的数据对象内部包含年、月、日、时、分、秒、date=年月日、time=时分秒、msgDate=聊天场景下可能会用到的时间格式。

2022-01-21 18:59:23 892

原创 uniapp 实现微信小程序全局分享及自定义分享按钮样式

uniapp 微信小程序 全局分享 Vue.mixin() 混入 onShareAppMessage() 和 onShareTimeline() 方法,微信小程序自定义分享按钮

2021-12-24 11:44:06 8452 6

原创 Vue组件传值:父传子、子传父、兄弟组件间的传值

父组件向子组件传值1.在子组件的props 中以数组形式接收父组件传递过来的值;2.父组件在使用组件时在组件属性中使用 v-bind 指令动态传值给子组件。示例如下:<body> <div id="app"> <div>{{tip}}</div> <!-- 调用 tab-bar 组件并传值,注意动态传值要给属性名添加上 v-bind 指令 --> <tab-bar :t..

2021-11-07 01:21:01 491

原创 前端面试题汇总

CSS 与 HTML 部分什么是盒子模型?在网页中,一个元素占有空间的大小由四个部分组成,分别是:元素的内容 content、元素的边距 padding 、元素的边框 border 和元素的外边距 margin,此四部分一起构成了 CSS 中元素的盒子模型。常见行内元素有哪些?块级元素有哪些?空元素有哪些?行内元素:a、b、span、img、input、strong、select、label、em、button、textarea块级元素:div、ul、li、dl、dt、dd、p、h1~h6、..

2021-11-06 00:51:11 911

原创 事件对象的 slientX、offsetX、screenX、pageX 看图就行

注:图片来源https://segmentfault.com/a/1190000018996051

2021-11-05 23:01:25 80

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除