weixin_42077503的博客

原创 Next.js中使用＜input type=“radio“＞checked默认勾选失效的问题

正常情况下Huey应该被默认勾选，但是实际情况是刷新时Huey被勾选了一下然后又消失了。找到原因是Next.js的问题。我的Next.js版本：13.4.12。

原创 threeJS与模型交互

threeJS与模型交互

原创 threeJS嵌入可交互的普通页面

threeJS嵌入可交互的普通页面

原创 threeJS 让物体延指定路线运动 & 生长的线

threeJS 让物体延指定路线运动 和 生长的线 的实现

原创 ThreeJS绘制路径方案

ThreeJS绘制路径方案

原创 踩坑记录：vue使用debounce函数

正确写法：<template> <h-page-container> <el-button @click="handleClick()">点我</el-button> </h-page-container></template><script>import { debounce } from './common.js'export default { name: 'Hello', dat

原创 js实现一键复制文字

js实现一键复制文字

原创 vue使用json-server模拟get和post接口初探

安装：npm install json-server -g注：要提前准备好node环境哦~准备mock数据：新建一个db.json文件，这里我将它放在src/mock/下。{ "hello": [ { "name": "tom", "age": 18 }, { "name": "jack", "age": 19 } ]}启动：在控制台里输入"json-server -h"可以查看json

原创 element-ui实现ip输入框

这个输入框分为4个部分，前面的框满了3个数字后自动跳到后面的框，并且支持复制如'127.0.0.1'这样的ip。代码如下：<template> <el-popover ref="popoverInput" :content="tips" :max-width="tipsMaxWidth" :placement="tipsPlacement" :show-html="true" :offset-placement="tipsO..

原创 element-ui实现激活码输入框

这个输入框分为8个框，前面的框满了4个字符后自动跳到后面的框，并且支持复制如'aaaa-aaaa-aaaa-aaaa-aaaa-aaaa-aaaa-aaaa'这样的激活码。代码如下：（这个功能是由ip输入框修改而来，个别注释和变量名还是ip请勿见怪）<!-- * @Author: * @Date: 2021-12-16 16:43:32 * @Description: 激活码输入框--><template> <el-popover ...

原创 eslint配置文件

{"workbench.iconTheme":"vscode-icons","editor.tabSize":2,"eslint.codeAction.showDocumentation":{"enable":true},"eslint.autoFixOnSave":true,"eslint.options":{"extensions":[...

原创 ＜img＞图片url获取失败时通过onerror显示默认图片

第一种方法：<img :src="data.imagePath" :onerror="errorImage" />在data中：errorCarImg:`this.src="${errorCarImg}";this.style="width:56px;height:56px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);this.onerror=null;"...

原创 Vue中使用transition或transition-group标签实现动画效果

transition和transition-group是Vue官方提供的两个内置组件，他们会检测所有子节点的插入和移除，依次在这些属性作用的各个阶段抛出钩子函数接受我们定义的动画或者第三方库里的动画然后再把每个阶段的动画重新拼接成一个完整的动画效果。利用这两个内置组件可以实现一些简单的动画效果。本文针对transition和transition-group实现动画效果以例子的形式做简要介绍。1、transition动画：例子效果图：点击“开“...

原创 使用了弹窗和i18n出现Error in render: “TypeError: Cannot read property ‘_t‘ of undefined“的解决方案

首先要确保在main.js里面把vue挂在在window.vm下（vm这个名字可以自定义）window.vm = new Vue({ el: '#app', i18n, router, store, render: h => h(App)})其次，在弹出框中写多语言时需要加上vm.比如平时在写多语言时是写{{$t('xxxxx')}} 或 this.$t('xxx')这时就需要写{{vm.$t('xxxxx')}} 或 this.vm.$t('xxxxx')...

原创 vue 从文件流下载文件

downLoadQueryVehicleCSV( '/tvdms/search/exportIllegalVehiclePassingAll.do', params).then(res => this.fullscreenLoading = false ).catch(res => { this.fullscreenLoading = false });function downLoadQueryVehicleCSV(url, params) {

转载 git remote: HTTP Basic: Access denied 错误解决办法

问题描述：git push 报 HTTP Basic: Access denied 错误原因：本地git配置的用户名、密码与gitlabs上注册的用户名、密码不一致。解决方案：如果账号密码有变动 用这个命令 git config –system –unset credential.helper 重新输入账号密码 应该就能解决了如果用了第一个命令 还不能解决问题那么 用这个命令：git config –global http.emptyAuth true3.如果以上两个方法不起作用，那么采用以

原创 git日志提交规范

原创 BeyondCompare3提示许可密钥过期的解决方法 BeyondCompare3破解

删除“”C:\Users[Your User Name]\AppData\Roaming\Scooter Software\Beyond Compare 3文件夹即可。

原创 Vue中使用transition或transition-group标签实现动画效果

效果图:html:appear属性是关键，他会让页面在刷新时就开启动画<transition-group name="slide" tag="ul" class="list-wrapper" appear> <li class="list" v-for="(item) in lists" :key="item"> <span class="text">{{item}}</span> </li><

原创 echarts饼状图引导线左右对称渐变、引导线上文字左右对齐（Vue实现）

效果图：大致思路：平时看echart是官网的例子大多数都是在option里面直接添加属性，但是如果想要达到每一条数据的样式都不一样采用这种方式是无法实现的。其实可以通过series.data等于一个属性的对象来实现。提示:该demo数据最多8条option：var option = { tooltip: {}, series: [ { type: 'pie', radius: [45, 75]

原创 echarts在y轴/x轴文字过长时显示...省略号其鼠标悬浮时出现提示

HTML<div id="alarmVehicleNumber" style="width: 100%;height:256px;" class="echarts" ref="Bar"></div><div class="x-axis-tip"></div>class="x-axis-tip"所在div是提示泡divCSS/* 气泡的样式 */.x-axis-tip{ display: none; position: absolute; p

原创 Vue项目引入three.js教程

Vue项目引入three.js教程引入three.jsnpm install three --save-dev在vue文件中：<template> <h-page-container> <div id="container"></div> </h-page-container></template><script>import * as Three from 'three'expor

原创 D3.js在vue中实现水波球

参考：https://www.cnblogs.com/flashing-magic/p/11776365.htmlhttps://blog.csdn.net/slzs_zyt/article/details/81068783https://blog.csdn.net/code_for_free/article/details/52268686

原创 解决canvas线条变粗变模糊的方法

在网上试了用0.5px像素的方法，结果不是很明显，然后发现是因为用style修改了画布的大小，style只是拉伸了画布，如果要修改画布大小应该这样写

原创 vue项目在“npm run dev"时出现的错误解决方法

若出现如下错误：解决方法：把node_modules文件夹删掉，运行npm install再运行npm run dev 就可以正常运行了

原创 将http网站免费升级为https（ssl+nginx）

首先，要在阿里云或者腾讯云买一个免费的域名因为我的云服务器是在华为云买的，所以我选择dns认证方式，接着就是按照指引把给出的信息在添加到华为云里去。最后认证通过后把阿里云里的ssl证书下载下来（包含一个.key文件和一个.pem文件）nginx的配置部分见：添加链接描述...

原创 vue+nodejs+mongodb全栈项目部署到云服务器之nginx安装教程

https://segmentfault.com/a/1190000012186563最后一部分

原创 nodejs+mongoose循环数据查询出现的异步问题

后端向前端传递数组，可是前端接收不到。主要代码:（业务逻辑：我有一组id，需要通过这一组id来查询出商品的信息，把这些信息汇总到一个数组然后传递给前端）原代码：这时nodejs的控制台：可以看到我的两条数据已经在数组里了但是前端却接收不到，前端的network如下:在牛客网发帖问了问网友，他们提醒我是异步问题，然后看了promise等一大堆乱七八糟的东西，依旧很懵，不知道该怎么解决...

原创 vue在npm run dev运行项目时出现npm ERR! code ELIFECYCLE问题解决方案

今天准备开始一个新项目，于是用vue-cli创建了一个项目，可是当npm run dev时报错：解决方法：第一步：npm uninstall webpack-dev-server第二步：npm install [email protected]第三步：npm run dev这是项目已经跑起来了，当你看到可爱的百分比数字逐渐增长时，不要高兴太早，他还会报错：解决方法：np...

原创 better-scroll引入后报错Uncaught ReferenceError: exports is not defined

@TOC【求助帖】better-scroll引入后报错Uncaught ReferenceError: exports is not defined我在代码中引入了better-scroll之后浏览器就开始报错:并且还报了很多很多警告警告非常非常多，就不一一截图了求大神告知该怎么办很绝望...

原创 JavaScript日常练习：求斐波那契数列第N项的值、网页计算器

斐波那契数列是指从第三项开始，每一项都等于前两项之和。<script> function recursion(n){ if(n<0){ return '输入的数字不能小于0‘; }else if(n==0){ return 0; }else if(n ==1)...

原创 JavaScript日常练习：二维数组转置、冒泡排序、插入排序、模板:省份城市的三级联动

1.二维数组转置：如：转置前arr[[‘a’,‘b’,‘c’],[‘d’,‘e’,‘f’],[‘g’,‘h’,‘i’],[‘j’,‘k’,‘l’],]转置后res[[‘a’,‘d’,‘g’,‘j’],[‘b’,‘e’,‘h’,‘k’],[‘c’,‘f’,‘i’,‘l’],]我们得出规律：res[i][j]=arr[i][j],且res数组长度=arr元素长度，res元素...

转载 Python3.7运行web.py测试时出现RuntimeError: generator raised StopIteration异常

解决方法：参见：https://blog.csdn.net/qq_38591756/article/details/84971485#commentBox

原创 关于JavaScript Dom的两个通用型函数：addLoadEvent和insertAfter

addLoadEvent函数：不管打算在页面加载完毕时执行多少个函数，它都能应付自如。它只有一个参数：打算在页面加载完毕时执行的函数的名字。它由Simon Willison（详见http://simon.incutio.com）编写的。下面是addLoadEvent函数的代码清单：function addloadEvent(func){ var oldonload = window....

原创 练习：红色十字架

使用重构的方式制作出一个如下图的水平、垂直都居中短边为50px，长边为150px的红色十字架。十字架要求：1.使用2个div完成2.使用3个div完成3.使用5个div完成答案：1个div： &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;...

原创 webstorm安装

今天webstorm提醒我更新，结果我不小心把原来的项目文件也和旧的webstorm一起卸载了。真是吐血（以后再提醒我更新我再也不更新了！！！害得我浪费了好几个小时时间。记录一下:恢复文件用腾讯电脑助手，在功能里搜索文件恢复功能即可。破解教程：https://blog.csdn.net/xr510002594/article/details/81488461（这里必需吐槽一下，说好的学生可...

转载 前端学习：w.onload和 $(document).ready()的区别

查找并整理了一下window.onload和 $(document).ready(function(){})区别，当作学习笔记，记录在这里。原文链接：https://www.cnblogs.com/jiajia123/p/6107748.html1、执行时间上的区别：window.onload必须等到页面内（包括图片的）所有元素加载到浏览器中后才能执行。而$(document).ready(f...

原创 关于前端学习静态页面遇到问题的求助帖

前端学习的一些问题：本人小白刚开始学习html和css，尝试自己写一些静态网页当作练习，有一些问题想请教各位大佬们。如何实现这样的标题栏？而我实现的样子是这样：为什么我的标题栏左右端对其了以后不在一行了呢？以下是我的HTML代码和css样式表：&lt;p class="i1"&gt; &lt;span&gt;合肥&lt;/span&gt; ...