- 博客(109)
- 资源 (2)
- 收藏
- 关注
RSS订阅原创 React-Router添加路由页面切换时的过渡动画
这里我找到了一个React的官方动画库react-transition-group。需求要点击页面导航，组件有动画展示效果。这样就会使点击的导航路由有动画效果了。
2024-07-09 14:50:31
177
原创 react中用less的问题
这里添加依赖会出现兼容问题craco-less 跟react-scripts和@craco/craco版本兼容官网上有给到可兼容的版本信息修改一下本地项目版本。
2024-04-18 16:50:41
522
原创 vue知识点————$nextTick
在项目中我们要跟后端请求数据，拿到数据处理后渲染DOM，然后可能根据业务需求，要求对DOM节点进行一些操作或者，或者DOM节点，这时会出现DOM没更新完后，你获取DOM是拿不到的。在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM。但是会报错说DOM节点不存在。因为我的DOM节点是根据后端返回数据多少个循环的。比如我在项目中用到了echarts。要拿到DOM的节点渲染。所以这里就会用到**$nextTick**
2023-09-13 15:28:16
279
1
原创 Electron 两个线程
Electron：它允许使用最初为Web应用程序开发的前端和后端组件开发桌面GUI应用程序：后端的Node.js运行时和前端的Chromium。每个Electron应用都有两个线程：一个是主线程（处理应用窗口和启动），另一个是渲染线程（基本上是您的UIWeb代码）。还有一个预加载脚本，用于连接两个 “世界”。渲染器线程Electron使用Chromium在称为渲染过程的独立过程中显示网页。这个线程处理/src文件夹中的UI代码。 在这里你将无法使用Node.js的强大功能，但预加载脚本将允
2023-09-07 16:18:07
1080
原创 vue知识点————插槽 slot
父组件< template > < div id = " app " > < child url = " https://www.baidu.com " v-slot = " slotProp " > 百度---{{ user.name }}地址为{{ slotProp.url }} < script > import child from "./components/child.vue";
2023-09-07 15:50:52
400
原创 vue 知识点———— 生命周期
Vue实例从创建到销毁的过程，叫生命周期。从开始创建、初始化数据、编译模版、挂载Dom-渲染、更新-渲染、销毁等过程。
2023-09-07 12:03:46
403
原创 echarts折线图 一条由实现虚线一起展示
两天虚线跟实线的链接点 一定要和实线最后的一个数据一样，否则就链接不起来，每条线的颜色已经样式可以单独设置，如果有更多条可以再往后加。
2023-05-10 11:48:58
1397
原创 vue中用到element的 弹框做echarts 的展示 报错Error in v-on handler: “Error: Initialize failed: invalid dom.“
所以要在 this.$nextTick 里面写echarts 展示的功能去获取dom节点。点击按钮的时候我要弹框显示出来并且 echarts图标展示出来。这里翻译出来就是找不到对应的有效dom。
2023-04-28 11:37:19
447
原创 vue中用echarts 报Cannot read properties of undefined (reading ‘init‘)
最好官网的引用不是这样的应该改成下面就会好了。在main.js引用的是。
2023-04-27 14:47:38
252
原创 element table 文字居中改变 表头背景颜色
这里有个现象 当表格内容都居中 表头会自动居中。并且这里还可以改变table 表头的样式。
2023-04-26 16:30:22
148
原创 element table设置某列背景颜色
这里的返回值是四个 文档中有写到{row, column, rowIndex, columnIndex}**columnIndex 是列 rowIndex 是行 **这里根据判断第几列设置颜色。自己可以打印看一下返回的值。
2023-04-26 16:16:46
1807
1
原创 vue2 中 Cannot find name ‘activeIndex‘.ts(2304)
发现个小问题不影响页面，但是在编辑器中一直有红线标注很不舒服，找了半天原因找到了，因为我在vue2中没有用ts，这个问题找弄了很久才发现。在这里找到vue3 并且把他关闭后了，重新加载后页面代码显示就正常了。发现是vscode编辑器中的扩展导致的。
2023-04-26 12:01:21
199
原创 vue使用element的布局 发现没有撑满全屏
注意要是样式写在style里 要覆盖element的样式不可以在style上添加。这么写的话是覆盖不住element的样式的 必须把。给el-contaniner 添加一个高度。Main 没有把页面其余部门撑满。
2023-04-24 15:38:42
1144
原创 ＜router-link＞ - did you register the component correctly? For recursive comp
vue 项目中添加了route 发现配置文件搞好后路由的。
2023-04-24 15:28:43
144
原创 vue使用scss 报错 Failed to resolve loader: sass-loader You may need to install it.
两个都运行完成后 再运行项目没有报错的话就可以用了。
2023-04-24 15:27:31
399
原创 css裁剪图片 clip-path
clip-path 属性使用裁剪方式创建元素的可显示区域。区域内的部分显示，区域外的隐藏。可以指定一些特定形状。上面的点可以移动 中间圈住的区域就是展示的区域设置背景图大小 放置服务器上的图片url这些百分比就是那些图片上点的数据 根据不同数量的点会不同数...
2022-06-28 15:23:00
1451
原创 git 强行拉取覆盖本地
git fetch --all && git reset --hard origin/master && git pull
2022-04-02 15:16:13
3451
原创 js 随机取值 概率随机取值
取0~30内的数字Math.floor(Math.random()*30)取数组中的 每个值 随机let arr=[9,12,33,24,65,7]arr[Math.floor(Math.random()*arr.length)]随机出题 取题目中的一个 不重复题目拿上面的案例会出现出现重复的所有我们要改变一下let arr=[9,12,33,24,65,7]arr.splice(Math.floor(Math.random()*arr.length),1)[0]//这样每次取值
2022-03-31 16:04:49
1443
原创 css 字体描边
<div class="letter">开始游戏</div>.letter{ width: 200px; height: 100px; text-align: center; line-height: 100px; background: rgb(255, 200, 42); font-size: 36px; font-weight: 400; z-index: 2; color: rgb(255, 255, 255) ; --stroke-width: 0.
2022-03-23 14:43:25
907
原创 vue 中canvas 根据点画出圆滑的曲线
文件BezierMaker.jsvar BezierMaker = function(canvas, bezierCtrlNodesArr, color) { // this.canvas = canvas this.ctx = canvas this.bezierCtrlNodesArr = bezierCtrlNodesArr ? bezierCtrlNodesArr : [] this.color = color ? color: '#ffffff' thi
2022-03-11 15:22:20
1968
4
原创 js canvas画板根据鼠标画出圆滑的线
<canvas id="canvasBg" width="1600" height="900"></canvas> let isDown = false; let points = []; let beginPoint = null; let canvas=document.getElementById('canvasBg') const ctx = canvas.getContext('2d'); ctx.strokeStyle = 'red'; ct
2022-03-11 14:49:40
822
原创 js数组对象排序
var compare = function (prop) { return function (obj1, obj2) { var val1 = obj1[prop]; var val2 = obj2[prop]; if (!isNaN(Number(val1)) && !isNaN(Number(val2))) { val1 = Number(val1); val2 = Number(
2022-03-03 14:04:25
192
原创 vue 在固定区域内拖拽
<template> <div id='pondModel'> <span v-for='(item,index) in 6' :key='index' @mousedown="move" ></span> </div><template>methods: { move(e){ let odiv = e.target let disX =e.clientX - odiv.offsetLe
2022-03-03 11:11:29
2527
1
原创 小程序人脸识别 图片转换成base64 上传给后台
npm i pako小程序要构建一下npmconst upng = require('../../../utils/upng.js')wx.initFaceDetect({ success:(res)=>{ const context = wx.createCameraContext() console.log(res,123) console.log(context) const listener = context.on.
2022-01-04 15:59:43
884
原创 ui 给的Json 特效文件在小程序中展示
npm install --save lottie-miniprogramnpm init记得要在小程序工具中构建一下npm<canvas id="booth" type="2d" class="booth" />import lottie from 'lottie-miniprogram' onLoad(){ wx.createSelectorQuery().selectAll('#booth').node(res => { const canvas = r.
2022-01-04 15:04:12
1019
原创 小程序生成用canvas生成海报
<view class="saveImg" bindtap="saveImg">保存到相册</view><view class="canvasImg" wx:if="{{canvasImgState&&!tempFilePathState}}"> <canvas canvas-id="myCanvas" style='width:{{canvasW}}px; height:{{canvasH}}px;' /> </view
2022-01-04 14:55:59
1521
原创 小程序 自定义头部导航 跟右侧按钮对齐
<view class="navTop" style='padding-top:{{navtop}}px;'>头部</view>.navTop{ width: 100%; height: 40px; line-height: 40px; text-align: center; color: rgba(255,255,255,.8); font-size: 34rpx; position: fixed; top: 0; left: 0;}d
2021-12-05 15:17:29
1994
原创 vue3.0 组件中调用router
<script setup>import { useRoute,useRouter } from 'vue-router'const route = useRoute() //路由参数const router = useRouter() //跳转路由// 页面初始进来获取query参数 也可以接收params参数if(route.query.data){ console.log(route.query)}//点击跳转路由 并使用query携带参数 也可以用paramsfun
2021-10-18 15:24:35
598
原创 vue3.0 父子组件通信
父组件<template> <div class="parent"> <Child :data="count" @handle="change" /> <button @click="add">父组件的按钮</button> </div></template><script>import Child from './components/child.vue'import { de
2021-10-18 15:16:07
201
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人