- 博客(46)
- 收藏
- 关注
RSS订阅原创 开发环境配置本地hosts修改域名
直接 Win+R 键输入： C:\WINDOWS\system32\drivers\etc 找到hosts文件后，首先右击先打开它的文件属性，切换到“安全”，然后选中当前需要更改的用户名，再点击下方的“编辑”，在弹出的编辑权限操作界面进行操作：先选中用户（这里一般都选users前缀的），选中后勾选下方的“修改”和“写入”权限，完成后，先点击“应用”再点击“确定”。hosts文件用 记事本 的方式打开，其他的不用管，直接在最后面另起一行，依次输入IP地址、空格、域名，然后回车换行，保存即可
2024-03-20 18:20:31
469
1
原创 excel导入功能（适用于vue和react都可）
使用customRequest 覆盖默认的上传行为，自定义上传实现，const FormDatas = new FormData();
2024-03-15 19:07:33
386
原创 项目中将sass更换成less（TypeError: this.getOptions is not a function已解决）
这个错误是由于less-loader版本不兼容导致的，直接npm install [email protected] 重新启动项目就可以了node版本16.19.0less版本: 4.2.0less-loader版本：5.0.0如果还是报错，试试把node_modules和package-lock.json文件删掉再重新下载npm i 或npm i -f
2024-01-30 17:01:38
969
原创 TypeScript基本语法
TypeScript 在 Javascript的基础上加入了静态类型检查功能，因此每一个变量都有固定的数据类型；循环迭代 ：for和while循环，并且为一些内置类型如Array等提供了快捷迭代语法（例如for in和for of）；函数：利用function关键字声明函数，并且支持可选参数、默认参数、箭头函数等特殊语法；类和接口：具备面向对象编程的基本语法，例如interface、class、enum等。也具备封装、继承、多态等面向对象基本特征；模块开发：应用复杂时，我们可以把通用功能抽取到单独的ts文件
2023-12-09 19:56:58
457
原创 uniapp实现拨打电话跳转手机拨号界面 （ios和安卓通用）
效果展示：左边为安卓系统展示，右边为ios系统展示。api解析：uni.makePhoneCall(OBJECT) 拨打电话，phoneNumber 需要拨打的电话号码。拓展：点击弹出电话号码列表，选择其中一个电话号进行拨打。api解析：uni.showActionSheet(OBJECT) 从底部向上弹出操作菜单，itemList按钮的文字数组，tapIndex 用户点击的按钮，从上到下的顺序，从0开始
2023-12-05 17:56:03
2706
原创 uniapp报错[Vue warn]: Invalid default value for prop “list“: Props with type Object/Array must use
uniapp报错。[Vue warn]: Invalid default value for prop "list": Props with type Object/Array must use a factory function to return the default value.这个报错是由于在使用uniapp中的Vue框架进行父传子操作时，给一个类型为 Object 或 Array 的 prop 设置了无效的默认值。在Vue中，类型为Object或Array的prop必须使用一个工厂函数来返回默
2023-11-29 14:09:27
792
原创 Vue和React配置解决跨域，proxy代理两步搞定
Vue配置：第一步找到 vite.config.js 文件 进行如下代码配置，第二步写入项目代理名（我这里是写在我的api文件里面）React配置：一行代码搞定：找到 package.json 文件 ，进行proxy配置
2023-11-28 18:06:32
572
原创 macbook在网页上下载的软件不在启动台出现的解决办法
打开终端，在终端中输入这两行命令 defaults write com.apple.dock ResetLaunchPad -bool true killall Dock
2023-11-13 10:41:58
2457
原创 vue3 + antd 图片上传 （精简篇）cv即可
使用antd组件库里的 a-upload 上传图片name：发到后台的文件参数名 （常用于同一页面需要写多个上传图片时）list-type：上传列表的内建样式，支持三种基本样式 text, picture 和 picture-cardbefore-upload：上传文件之前的钩子，参数为上传的文件，若返回 false 则停止上传。customRequest：通过覆盖默认的上传行为，可以自定义自己的上传实现 （最常用）
2023-11-10 18:29:27
815
原创 前端打印表格功能+单号生成条形码
两种打印方式：1.浏览器自带打印功能。2.使用printJs插件。生成条形码使用JsBarcode。解决有的时候条形码不显示问题，尝试使用setTimeout函数延迟一段时间后再执行打印操作，以确保页面元素加载完全。解决打印内容的页面样式丢失问题（原本我的样式是在插入每一行元素前设置的），将样式写在了setTimeout里面，并将样式赋给了 printJS 里的style属性。
2023-10-30 16:10:03
496
原创 Error: @vitejs/plugin-vue requires vue (＞=3.2.13) or @vue/compiler-sfc
vue3项目运行报错，试了很多方法都无法解决时，请再查看一下是否node版本是否正确，nodejs版本不能低于 16
2023-09-26 16:41:20
201
原创 原生微信小程序报错：[ app.json 文件内容错误]app.json:[“usingComponents“][“van-image“]:“@vant/weapp/image/index“
解决方法：首先 npm i 下载项目依赖。下载完成后再在左上角工具--构建npm 生成miniprogram_npm包。直到生成miniprogram_npm包后，直接把node_modules文件夹删除 重新编译项目就可以啦～
2023-09-25 18:13:03
553
原创 启动uniapp小程序报错：Error:app.json:在项目根目录中未找到app.json
产生原因：uniapp小程序不能直接被微信开发者工具解析编译，需要先生成unpackage文件夹再进行编译。解决方案共有两种（任选其一即可）：方案一：前提是项目代码中已经含有 unpackage 这个文件夹且mp-weixin文件夹不为空，直接编译运行mp-weixin即可方案二：使用其他编辑器打开项目，然后编译到微信开发者工具启动项目 （推荐）
2023-09-25 16:28:38
6164
9
原创 Mac 苹果系统使用nvm use 切换node版本号
博主最近换了苹果系统后，发现苹果系统不能全局更改node版本。我在vscode中使用nvm use x.x.x之后，下次打开新的bash或者重新打开项目,发现node版本又恢复到一开始的，以下是我的解决方案：第一步首先 nvm use '版本号'切换node版本号；第二步使用nvmalias default '版本号' 设置默认版本号，这样下次再打开项目时node版本就是这个默认版本号。最后重启编辑器就可以啦
2023-09-25 11:14:18
1115
原创 拉代码后npm i 提示代码更改9999+是因为创建代码仓库把node_modules文件提交到了git仓库
将仓库代码拉下来后下载依赖包 npm i 显示更改 9999+，打开一看发现全是node_modules文件相关的。以下是我的详细解决方案：首先在根目录下的.gitignore文件中写入node_modules/，确保下次提交排除node_module文件夹；再node_modules从 git 追踪中删除，命令如下 git rm -r --cached node_modules ，最后重新提交即可
2023-09-14 16:30:01
270
原创 Vue/React 项目部署到服务器后，刷新页面出现404报错
在本地启动项目一切正常，部署到服务器上线后出现BUG，项目刷新页面出现404 ，共有两种解决方案。一，vue router 的 mode 改成hash 。二，配置nginx，将任意页面都重定向到 index.html。扩展1: 为什么hash模式下没有刷新页面404 问题。扩展2：vue路由的两种模式 hash和history的区别
2023-08-31 18:37:49
2151
3
原创 vue3与vue2的区别
vue3 的优势：更快的速度：① 重写diff算法； ②模板编译优化； ③更高效的组件初始化。更容易维护：①组合式API；② 更好的TypeScript支持。更小的体积：①良好的TreeShaking；②按需引入。更优的数据响应式：Proxy
2023-08-02 17:41:56
100
原创 创建Vue3项目（基于create-vue）以及关键文件介绍
只需四步即可创建Vue3项目，前提环境条件：已安装 16.0 或 更高版本的Node.js 。第二步：创建一个vue应用：npm init vue@latest 这一指令将会安装并执行create-vue。第三步：根据上一步你自定义的项目名称进入文件夹。例如：我这里命名的项目名称为vue3-project，那么我需要先执行 cd vue3-project 命令，然后 npm install。最后执行 npm run dev 命令即可启动项目。关于项目目录和关键文件介绍点击此处进行详细查看
2023-08-02 15:36:04
178
2
原创 创建uniapp项目（解决报错[Vue warn]: Unhandled error during execution of async component loader）
首先使用HBuilder X编辑器新建项目，uniapp创建项目vue2和vue3详细步骤都有。注意：如果是vue2项目，除了第二步代码要更改，第三步和第四步的文件路径中应将 uview-plus 改成 uview-ui
2023-08-01 18:03:41
2501
原创 前端导出excel （Vue，React通用）
纯前端的数据处理转excel，正常情况下是需要后端生成文件流后，我们再导出。请注意，在使用此方法之前，你需要在项目中安装XLSX库。你可以通过npm安装XLSX库，命令如下：npm install xlsx --save
2023-07-18 18:07:09
721
原创 启动项目下载依赖（npm i 或npm i -f）报错 node-sass问题已解决
启动项目下载依赖报错 node-sass问题：node版本与node-sass不匹配。解决后发现又出现了一个问题：node版本与npm版本不匹配，需要调整对应的npm版本 。最后使用指定命令npm install --ignore-scripts来跳过Node Sass的编译步骤即可解决最终问题
2023-07-10 18:29:38
1118
原创 nvm下载node版本报错：Could not retrieve https://nodejs.org/dist/latest/SHASUMS256.txt.
使用nvm 无法成功下载node版本，在nvm的安装包里面找到 settings.txt 文件配置镜像源node_mirror: https://npmmirror.com/mirrors/node/npm_mirror: https://npmmirror.com/mirrors/npm/
2023-07-10 10:25:57
543
原创 微信小程序WXML模板--事件对象属性以及target和currentTarget的区别
当事件回调触发的时候，会收到一个事件对象event。target 是 触发事件的源头组件，而 currentTarget 则是 当前事件所绑定的组件
2023-06-15 18:24:43
348
原创 时间戳转换为 年月日时分秒 （出生日期转换为岁、月、天）
获取当前日期的时间戳。时间戳 转换为 岁、月、天 ；时间戳 转换为 天、小时、分钟、秒；时间戳 转换为 年月日时分秒
2023-06-12 18:33:31
580
原创 uniapp页面跳转携带参数 两个页面互相传参
uniapp页面跳转携带参数 两个页面互相传参。参数与路径之间使用?分隔，参数键与参数值用=相连，不同参数用&分隔。这里有一个误区，this的指向需要注意，由于我的语法用的是vue2，直接使用了this，发现一直没赋值上去，后来发现this指向不对，因为我这里用的不是箭头函数，所以它的this指向了函数本身，我们需要提前把this保存了，然后再进行赋值
2023-06-09 18:33:05
2796
原创 vue项目添加新的环境 统一处理dist打包（三步搞定）
vue前端配置新环境启动项目，dist打包：我们可以直接通过NPM 脚本给项目进行dist打包发给后端，起初项目里是没有 dist 文件夹的 ，点击圈出来的小三角即可打包生成dist 文件
2023-06-06 18:48:16
1350
原创 Vue3项目中英文多语言切换（antd、element等组件库都可以使用）
使用 i18n 进行多语言切换。首先我们需要知道vue里进行语言切换需要用到插件，其次，初学者经常会理解的误区：认为下载了插件后就可以自动将全篇项目都进行语言切换。。其实不然，每当增加页面或者功能字段之类的，都需要将其进行语言配置。博主将把详细步骤以及代码都放在下面，大家捋清楚后直接粘贴复用即可。
2023-05-23 18:24:16
2907
6
原创 webStorm全屏波浪线问题（已解决）
更新webstorm后出现问题--如图：满屏都是红色波浪线，真的栓Q...刚开始以为是代码问题，但是项目可以正常启动，且页面不存在报错。第一步：点击文件-->设置--> 语言和框架-->JavaScript-->代码质量工具-->JSHint-->把启动按钮关掉 。第二步：点击文件-->设置--> 语言和框架-->JavaScript-->代码质量工具-->ESHint-->选择禁用按钮
2023-05-22 15:53:03
871
原创 AntdVue 全局配置国际化——中文（日期datepicker显示英文问题已解决）
AntdVue 全局配置国际化——中文（日期datepicker显示英文问题解决）， 全局配置后按键以及大部分内容都成功转为了中文，但是日期内的依旧还是英文。antd全局配置
2023-05-10 16:44:27
4046
9
原创 ref和reactive的使用场景和差异
在 vue3 中的组合式 api 中，针对响应式有了一些改变，其中响应式 api 中，两个比较重要的是 ref 和 reactive，但是对于这两个区别以及使用场景，大多数初学者都比较迷惑，下面博主讲详细讲述这两个区别以及使用场景一、原始类型差异在了解之前，我们要知道js中的原始类型有哪些，其中是一些原始基本类型，对于这些值，ref 和 reactive 用法上有啥区别呢？那到底什么时候使用ref，什么场景下使用reactive呢？
2023-04-28 17:02:41
892
原创 微信小程序开发--项目文件夹--详解
首先先介绍一下小程序的运行机制，包括两个方面，一方面是小程序启动的过程，一方面是页面渲染的过程，这个大家可以简单了解一下，这里需要注意小程序启动的顺序，当多个页面做交互时，需要考虑到这类问题。
2023-04-20 18:16:40
728
原创 使用nvm自由切换node版本
在管理多个项目时由于node问题导致项目无法正常启动， 使用nvm版本管理工具：全称是node.js version management,通过它可以安装和切换不同版本的node。下面列出下载、安装及使用方法。
2023-04-20 14:33:30
2611
原创 ios系统h5页面使用alert显示出现域名问题
使用了alert弹窗，在ios设备上弹窗弹出来的时候会显示出域名。alert（'下单成功'） 在安卓手机上不会显示上方域名，解决办法，给alert进行二次封装。直接将代码复制到js方法中即可，这样就可以正常显示啦。如果有更好的解决办法欢迎大家留言~
2023-04-19 23:27:12
754
原创 安装yarn时出现问题，‘yarn’不是内部或外部命令，也不是可运行的程序
接在项目里下载的yarn出现‘yarn’ 不是内部或外部命令，也不是可运行的程序 或批处理文件。添加并配置环境变量
2023-04-13 18:10:53
4070
原创 element单图片上传——复制代码即可
上传图片的流程：调用图片服务器时前端传一个图片文件file给后端，后台会返回一个正常且可以直接访问的图片链接，我们再将它放到页面中去渲染，具体参数怎么传需要先跟后端确认一下，一般都是一个file或者files。注意：上传图片（或视频）文件需要调接口是因为我们需要利用后端给的服务器把文件转化成url供我们前端页面进行展示使用，这才是图片上传的主要核心处理。
2023-04-12 18:06:30
965
3
原创 Vue3中的API——选项式API、组合式API
和。对于熟悉Vue2的人来说，选项式api是一个很好的选择，但Vue3提供的组合式api对于代码复用效果更为突出。博主之前是用的React框架，现在由于工作原因换成了Vue，所以个人更倾向于Vue3的组合式api。现在博主将为大家详细介绍这两者的区别以及具体的操作。
2023-04-08 16:10:13
5237
7
原创 Vue简介--vue3入门
Vue是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建，并提供了一套声明式的、组件化的编程模型，帮助我们可以高效地开发用户界面。无论是简单还是复杂的界面，Vue 都可以胜任。Vue 的设计非常注重灵活性和“可以被逐步集成”这个特点。无需构建步骤，渐进式增强静态的 HTML在任何页面中作为 Web Components 嵌入单页应用 (SPA)全栈 / 服务端渲染 (SSR)Jamstack / 静态站点生成 (SSG)
2023-04-08 15:04:01
301
原创 elementui内的el-date-picker日期格式转成后端规定的字段格式，只需一步搞定
比如：后端想要的是2023-3-20 00:00:00这样的格式，那么我们应该如何去操作呢？初学的小伙伴一定会觉得要利用很多方法才可以转为后台想要的格式，这里教大家一个最简便的办法，通过element-ui自带的属性，话不多说，直接看代码。date-picker默认绑定的值如图所示，很多小伙伴在调接口的时候会遇到这个问题，发现传过去的参数并不是后端想要的，那么我们应该怎么解决这个问题呢？只需输入这一行代码即可，若后台想要其他的格式，可以自己调整，这里给大家展示一下value-format的值应该如何确认。
2023-03-20 18:08:50
1960
3
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人