- 博客(20)
- 收藏
- 关注
RSS订阅原创 vue2使用antd实现单选，多选，本页全选以及所有数据全选
今天分享一篇关于使用a-table和a-checkbox进行渲染列表有分页的情况下怎么实现单选多选本页全选以及所有数据全选。然后我们找到table的row-selection，也就是控制单选反选的方法-rowSelection。这个方法一般在computed里：我们这里要进行两步操作，如图所示。1：首先在表格合适的位置加入一个复选框来作为你全选的按钮。如果有不懂的或者更好的解决办法欢迎评论区留言讨论。这里是对我们单选多选的操作，那么全选的操作如下。
2024-12-17 10:44:38
409
原创 VScode插件推荐
入门第一个插件，也是必备插件，因为vscode下载好默认是英文的，这让很多小伙伴很不习惯，所以安装了这个插件再重启就可以变成中文。提供你在 CSS 中使用颜色的相关信息，悬停光标，就可以预览色块中色彩模型，方便更改相近的颜色。安装后可以直接在代码里看到谁在什么时候提交了代码，查看当前哪些文件修改了什么，效果如下↓。一款能够自动提示文件路径，支持各种文件快速引入的插件，非常方便，节省大部分开发时间。可以自动格式化代码，让你的代码更美观，从此告别“ctrl+c和ctrl+f”（如果已设置此快捷键）
2024-12-09 11:33:18
256
原创 Vue项目配置字体包
打开网站之后按照下面的流程，就可以把你的ttf的字体包转换成base64的格式。字体包格式是ttf的最好，如果不是的话可以去网上找能转换格式的网站转换一下。配置成功之后重启一下项目，如果还是没生效就在对应页面的css里写入。有时候配置会不生效，这个时候要在vue.config里面写上。如果遇到什么其他的问题欢迎在评论区留言讨论。然后就可以看到字体变化成JDZY了。然后在需要加文字格式的页面下引入。下载返回给你的CSS文件就可以啦。
2024-08-23 10:51:31
307
原创 微信公众号内嵌vue的H5实现微信分享自定义卡片
具体需求大概是这样的，在公众号内嵌的vue项目在分享的时候走了微信的接口，分享出来的卡片是空白且没有图片的，像这样而正确的分享姿势应该是这样说完业务需求现在说实现方法，首先需要公众号支持分享的服务器外网ip地址，需要添加到白名单中，如图：绑定域名：登录公众平台进入“公众号设置”的“功能设置”里填写“js接口安全域名”备注：登录后可在“开发者中心”查看对应的接口权限，js接口安全域名要添加图片的连接域名或用oss规定图片域名要跟js接口安全域名里的域名一致，负责图片会有不展示的风险，这是个坑，要注意注*(如果
2024-08-23 10:41:37
1630
1
原创 在vue中配置开发环境，测试环境，生产环境
前言：开发过程、测试过程、生产过程使用的接口地址不能，还有执行的操作可能也不一样，也就需要实现配置好开发环境、测试环境、生产环境，需要什么环境下的配置直接使用即可。现在就算配置好啦，在打包的时候npm run build就是打包生产的;npm run test就是打包测试的。我在写这篇文章的时候图片取自不同项目，变量名可根据自己的情况来定，如果有解决不了的问题可以在评论区留言讨论。
2024-08-23 10:24:42
652
原创 在vue中一个项目使用两个不同域名的接口
如图所示，在'/api'下面新增，'/',也可以自定义，这样在api.js里写接口的时候，带/api的就走上面的那个域名，不带的就走下面那个域名，这样就可以一个项目里用两个域名的接口啦，当然这是最简单直接的办法，如果有更好的办法欢迎评论区讨论。在config.js的跨域配置proxy上配置。分享一个最简单粗暴的办法，适用于新手小白。
2024-08-23 10:11:48
553
原创 微信小程序实现定位功能
这个能返回一个稍微有点偏差的，我的偏差大概是在4公里这样，但是真机调试的时候没那么大。我也查阅了大量资料发现现在确实是有这个问题而且没有太好的解决办法，大家可以跟领导说一下这个问题，作为一个前端这些问题一定要及时反馈。可以看到用户可以自己去选择地址，如果应用场景是打卡什么的就不建议用这种了，下面是控制台打印的内容。可以看到这个自选的地址还是很精准的，大家可以根据情况来选择适合自己的定位。分享两个微信小程序获取定位的办法,用的腾讯的地图，可根据自己的情况改动。这是打印的值，大家可以参考一下。
2024-08-22 16:23:34
3197
1
原创 Vue实现定位功能并且在移动端能获取定位
另外这里的定位我当时测试的时候在IE浏览器是支持的，但是在谷歌和火狐测试就不支持了，后来查阅资料有个最靠谱的解释是后端要配置SSL证书把http升级成https，因为这个操作方式在不安全的浏览器页面是不支持的，所以大家在碰到这个问题的时候可以去跟后端沟通问一下有没有配置ssl证书。这个是简单的通过浏览器自带的navigator.geolocation来定位的办法，这里我做了小数点后六位的处理，所以位置不是那么精准，如果需要精确到具体位置的话可以解开经纬度小数点的限制。
2024-08-21 13:13:15
1270
原创 Vue项目在移动端调试办法
记录一下有些同学在写项目的时候不可避免的会在移动端展示，但是移动端又无法看到后台的参数和接口调用情况，本篇文章提供一个最简便便捷的办法供大家参考：通过vConsole来调试。引入完成之后重启一下项目就会在项目中出现一个vConsole的标签：如下图。这样在移动端想调试项目的时候点击这个标签就会打开vconsole的调试。当然在发版的时候记得把man.js里的vconsole注释掉哦。第二步：在man.js中引入vConsole。第一步：安装vConsole。
2024-08-20 16:18:47
597
原创 vue+H5移动端实现图片压缩上传
这样的解决方案只适用于在上传图片的时候因为图片过大无法成功调取阿里接口的时候来应用，一些其他的操作可以自己在代码中增加。此外，在input file获取图片的时候在移动端也会调出相机，这个可以解决相机拍照生成的图片过大无法上传到阿里接口，大家在用的时候可以根据自己的实际情况来调整压缩的参数。应用场景：在前端需要把图片通过接口上传到云端来获取图片id或url传给后端的时候如果是用的input file的方法来获取图片的时候有些移动端浏览器是不支持图片过大的，这个时候就需要将图片压缩，下面是操作方面。
2024-08-20 16:05:36
376
原创 Vue2的项目中使用Vant2的Toast组件报错Toast is not defined解决方案
在使用组件的时候直接通过this.$toast的形式去使用就没问题了。引入完成之后在使用的地方之间Toast.xxxx。
2024-08-09 10:30:15
414
原创 TypeError: Cannot set properties of undefined 解决方案
组件里写了script标签，忘记写export default{}了，把这个加上重新运行一遍就可以解决啦。希望大家引以为戒，这种错误还是不要犯的好哈哈。
2024-08-06 17:48:24
1311
原创 [ app.json 文件内容错误] app.json: 在项目根目录未找到 app.json (env: Windows,mp,1.06.2405020； lib: 3.5.3)小程序问题解决
app.json 文件内容错误] app.json: 在项目根目录未找到 app.json (env: Windows,mp,1.06.2402040;lib: 2.25.3)文件，如果有的话可以继续往下，没有的话可以转其他文查找原因。刚拉取下来的微信小程序，运行到微信小程序模拟器时出现【添加完成之后点击上方的“编译”重新编译就可以解决问题啦。（注意是根目录，不是刚刚那个目录下的）查找。在这个文件中添加一行[
2024-08-06 13:26:56
10993
5
原创 npm install -g @vue/cli报错npm ERR! code FETCH_ERROR或卡住不动解决方案
解决vue安装脚手架时卡住或者报错的问题
2024-08-06 09:22:12
2431
3
原创 npm安装依赖超时，报错npm error code ECONNRESET
解决方案：将npm的代理设置充值为无:即不使用代理，再次install就行。代码：npm config set proxy null。5:检查npm版本，确保使用的Node版本与npm兼容。3:使用yarn或者pnpm安装。如果还不行，参考以下解决方案。
2024-08-05 18:18:02
557
1
原创 Windows系统如何修改本地hosts文件？
作用是将一些常用的网址域名与其对应的IP地址建立一个关联“数据库”，当用户在浏览器中输入一个需要登录的网址时，系统会首先自动从Hosts文件中寻找对应的IP地址。C:\Windows\System32\drivers\etc，点击右下角【文本文档】，选择【所有文件】，点击出现的hosts文件，然后点右下角的【打开】，就会弹出hosts文件的编辑页面；第四步：修改完hosts文件后，点击【文件】-【保存】，或者直接按按ctrl+s保存，这样Hosts文件就修改成功了。
2024-08-05 17:50:55
2726
原创 npm install报错-＞npm ERR! Unexpected token ‘.‘问题原因及解决方案
今天通过nvm安装了node之后从git上拉取一套代码想运行一下来着，然后npm install的时候直接提示报错了，详细报错为上述代码,上网查了很多解决方案，现在给出在试过很多之后依然不好使的情况下最稳妥的解决办法———升级nvm版本！双击以文本的形式打开settings.txt文件，设置镜像，将下列两行代码复制放在原本的两行下面，注意是添加，不是覆盖！安装完成之后可以nvm list查看一下，有你所安装的node版本号就算成功了！这样就算更新了nvm，可以在你尝试所有办法不起作用的情况下使用。
2024-08-05 15:44:38
1487
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人