- 博客(109)
- 收藏
- 关注
原创 vue+element下拉选择器默认选择第一个并根据选择项展示相关数据
再使用默认数据进行数据展示(因为我这使用的下拉数据一次性返回,前端展示不需要再次发送请求)发送请求成功后将选择框的绑定数据修改为第一项的id 就能展示相关数据。展示数据列表使用了这个 统一字段展示的列表 循环展示字段+数据。
2025-05-12 11:25:12
233
原创 Git命令
-u 表示把本地分支和远程分支进行关联,只在第一次推送的时候需要带 -u 参数。# 从远程仓库中,把对应的远程分支下载到本地仓库,并把下载的本地分支进行重命名。git checkout -b 本地分支名称 远程仓库名称/远程分支名称。# 如果希望远程分支的名称和本地分支名称保持一致,可以对命令进行简化。git push -u 远程仓库的别名 本地分支名称:远程分支名称。git rm --cached 文件 #仓库删除 文件保留。git push 远程仓库名称 --delete 远程分支名称。
2025-04-10 09:42:16
526
原创 React中使用useState的set方法没有及时更新的处理
进行一个表单筛选的提交按钮 在进行选择后搜索 在发送请求时候没有携带变化后的参数。但是useEffect这个初始化函数 群友说多次调用不好 建议更换方法。进过查询 是useState为异步函数 没有及时更新情况。查询了一下AI 建议使用useEffect进行监听。在群友建议下 使用了解构。
2025-03-25 14:54:02
437
原创 React(12)案例--layout页面的部分
需要手动修改pagejson文件中的react和react-demo版本号为 18.2.0。这里注意 react版本过高会导致antd组件无法安装。创建对应文件夹和文件的json数据。
2025-02-28 15:10:48
431
原创 React(10)
项目实践--创建项目在store的modules中创建相关的子仓库暴露到仓库index文件中导入creatSlice和axios创建仓库 和数据的异步修改方法编写异步请求函数这存在一个后端接口返回值count 不准确的情况 使用双重foreach 将count变成1初始化导出store的index注册使用在App.js中调用仓库方法映射数据在App函数中调用使用仓库数据进行渲染渲染数据 使用useSelector进行渲染。
2025-02-25 14:53:08
521
原创 react(9)-redux
使用CRA快速创建react项目安装配套工具启动项目在创建项目时候会出现一个问题解决办法卸载全局安装的create-react-app。
2025-02-21 11:33:45
541
原创 React(7)
/ 4.在哪个组件中要用到这个逻辑,就执行这个函数,解构出来状态和回调进行使用。// 3.把组件中用到的状态或者回调return出去(以对象或者数组)// 2.在函数体内封装可复用的逻辑(只要是可复用的逻辑)只能在组件的顶层调用 不能在if for 其他函数中使用。只能在组件中或者其他自定义HOOK函数中使用。//1.声明一个以use打头的函数。封装自定义hook通用思路。
2025-02-12 17:55:45
451
原创 React(6)useEffect的基础使用
useEffect是一个React Hook函数,用于在React组件中创建不是由事件引起而是由渲染本身引起的操作,比如发送AJAX请求,更改DOM等等。子组件定时任务打印 在子组件的useEffect中进行return清除定时器。useEffect的基础使用。
2025-02-12 15:57:15
452
原创 React(5)
需要再父组件中存在这个定义方法,在子组件中传入,使用点击事件调用 应该是4321顺序。3、在底层组件B中通过useContext钩子函数获取数据。2、在顶层组件A中通过Ctx.Provider提供数据。直接在子组件标签内的数据 为children属性。2、props为只读数据 需要父组件进行修改。就是A组件传值给父组件 父组件传值给B组件。3、children 特殊的props。子组件的点击事件调用父组件的函数进行修改。App组件传值给A组件里的B组件。子组件中调用父组件函数进行传值。
2025-02-11 17:34:24
512
原创 React(4)
button onClick={handleList}>发送</button>这里仅实现添加进数组,实际为接口发送数据进行二次调用。2、点击按钮将数据写入数组中(前端实现不通过接口)设置一个变量收集输入框数据使用useState方法。获取输入框的dom对象 调用focus方法。输入框进行绑定输入值 和ref对象。onChange事件获取value值。3、发送成功后清空输入框以及聚焦。点击确认按钮修改数据。
2025-02-11 15:06:34
325
原创 React(三)
3、点击删除,动态展示更新后数据(不重要 一般后端接口控制)主要记住使用条件语句 和模板字符串。2、条件控制展示自己的删除按钮。4、动态控制css样式。动态控制显示和css。1、遍历展示评论列表。
2025-02-10 14:37:07
263
原创 React学习(二)
直接使用index++ 是不会修改视图 需要调用setIndex方法 set+自定义方法名为命名规则。对象的修改必须使用。展开运算符返回新的对象,不能修改原数组。使用闭合或者成对标签。
2025-02-08 10:20:49
222
原创 vue中 子组件在父组件中因为异步问题导致的的underfind报错问题
当父组件通过 props 向子组件传递数据时,如果数据在父组件中是异步获取的(例如通过 API 请求),那么在数据实际到达之前,子组件可能会先渲染并尝试访问这些尚未定义的数据。这通常会导致控制台中出现。我这里使用的是用v-if进行判断 虽然还是无法获取相关是msg 但是不报错。其中子组件数据为父组件发送数据请求后获取 使用props进行传值处理。这时候我发现控制台出现了underfind报错。在首页中展示介个相同样式的卡片组件。1、使用v-if进行判断展示。2.使用默认值进行展示。
2025-01-15 14:02:48
492
原创 vue3+TS+vueX的记录
举例 调用setTodo方法 将输入框的value传值写入todo数据中。要求:在页面中使用输入框输入回车后将数据保存到vuex中的数组list中。使用action调用mutation中的方法修改state的list。调用 输入框输入 点击回车后调用hooks中的setTodo方法。将类型为ITodo数据添加到state中的list最后一位。status为定义的三种状态 待办 在办 完成。获取到需要添加上的数据调用mutation方法。setTodo是hooks中结构出来的。
2024-12-19 17:16:09
288
原创 java自己记录
3、添加一个add方法 可以直接传值用第一步的user 类写类型 但是根据规范 建议使用xxxDTO或者VO使用 记得使用一个@RequestBody注解 会将传进来的json文本变成一个对象。//在UserRepository中定义的是user类 这个获取的是一个userVO类型的 需要进行转换。4、调用业务逻辑类 service 在创建一个业务逻辑类时候 也需要一个接口 规范化。6、返回service类中 自动装配写好的repository类的save方法。//调用数据访问类的方法。
2024-12-03 15:07:39
297
原创 echart改变最后一个节点的图标
这种方法比较复杂,需要你手动控制图片的渲染和更新,以实现动画效果。但是,这通常涉及到对Echarts内部渲染机制的了解,并且可能不如直接使用静态图片简单。:另一个选项是在Echarts图表之外使用Canvas或SVG来绘制和动画GIF图片。这可以通过监听Echarts的渲染事件,然后在图表上绘制额外的元素来实现。获取到每一个节点后 更具阶段坐标加图标的自生pandin值进行left和top的动态计算。在折线图的最后一个节点增加一个gif动图表示增长。你可以通过Echarts的。使用节点坐标加绝对定位。
2024-10-23 16:40:22
362
原创 keep-alive的保活
组件主要用于缓存组件的状态,当用户从一个路由跳转到另一个路由然后返回时,可以保持该组件的状态不变,避免不必要的重新渲染。默认情况下,只有当组件被标记为。的一部分,并且满足一定的条件(如组件实例未销毁或存在活跃的导航守卫),它才会被缓存。
2024-09-30 15:31:56
580
原创 图片懒加载
vue-lazyload会根据entries中的isIntersecting属性判断元素是否可见,如果是,则调用监听器对象的load方法,将元素的src或者style属性替换为真实的图片地址,并将该监听器对象从队列中移除。每个监听器对象都包含了元素的相关信息,如状态(state)、图片地址(src)等。vue-lazyload的核心原理是利用了IntersectionObserverAPI,这是一个用于检测元素是否与视口相交的API,它可以高效地监听元素的可见性变化,并触发回调函数。修饰符(注意冒号)。
2024-09-30 15:21:57
225
原创 Vue2中的监听和计算属性的区别
监听器(Watchers)是一种机制,用于在数据发生变化时执行特定的操作。监听器允许你监视 Vue 实例中的数据变化,并在数据变化时执行自定义的逻辑。1、支持异步操作2、接收两个参数,第一个是最新的值,第二个是旧的值3、监听的数据是data中声明过父组件传递过来的prop中的值,还可以监听路由$route4、immediate:组件加载立即触发回调函数的执行(为false时,只有监听的数据变化回调函数才会执行)5、deep:深度监听,一般用来监听对象。
2024-09-30 15:11:10
690
1
原创 数据劫持--Object.definePropertie
是JavaScript中的一个方法,它用于直接在对象上定义新属性,或者修改一个对象的现有属性,并返回这个对象。数据劫持:把一个对象里的属性进行可配置可写 可枚举,通过get set方法对取值 存取值进行逻辑上的扩展。数据描述符是一个具有值的属性,该值可能是可写的,也可能不是。取一个值的时候 先走get方法 当设置一个值的时候先看set方法的逻辑。1、什么是Object.definePropertie。vue2采用的就是这种进行响应式处理。
2024-04-10 14:14:32
423
原创 uniapp中导入css和scss的区别
是CSS中用于导入外部样式表的语法,但它不适用于导入SCSS文件。这是因为SCSS文件需要被预处理器(如Sass)转换成CSS,而。第一次使用的是@import url('static/common.scss');最好使用@import "@/static/common.scss";想要将其 导入到app.vue文件中。期望的是一个已经编译好的CSS文件。在项目中编写了一个基础的公共样式。编译直接报错,无法识别这个文件。common.scss文件。
2024-03-01 11:30:21
859
原创 在UniApp中引入大于40kb字体包的记录
因为项目UI需要特殊字体,所以给了一个80kb字体包,但是在正常的使用导入时候发现不生效这是我的导入过程1.把下载好的文件放入static/font目录中2.在app.vue中引用3.使用:但是不生效原因uni-app支持使用字体图标,使用方式与普通webhttpsuni-app超过40kb需要转换为base64格式。
2024-02-29 11:25:56
942
原创 el-upload组件实现上传拖拽排序图片顺序
Sortable.js是一款优秀的js拖拽库,支持ie9及以上版本ie浏览器和现代浏览器,也可以运行在移动触摸设备中。不依赖jQuery。支持 Meteor、AngularJS、React、Vue、Knockout框架和任何CSS库,如Bootstrap、Element UI。官方文档 https://github.com/SortableJS/Sortable。中文文档 https://www.itxst.com/sortablejs。之前是使用vuedraggable完成了一次上传拖拽的使用。
2024-02-22 16:36:38
1659
原创 小程序中使用瀑布流组件的记录
因为时间问题,我实在不好意思了哈哈采用了最简单的flex布局,只要数据量够多。2、后端返回的数据中带上框高进行比例计算,或者采用uni自带的获取图片属性api进行计算。1、进行左右两列元素的动态高度进行判断,将图片数据塞入,进行高度判断,直接进行左右分列展示,手动控制最大高度和溢出隐藏。在使用uniapp编写的小程序中做图片标题的数据展示,采用瀑布流布局。优点:数据展示左右排列,做到动态展示不会出现某一列特别出现留白情况。缺点:数据展示过慢,会出现一张张图片跳出的情况;我采用的是皮皮平博主写的。
2024-01-16 17:44:54
734
原创 vue2中关于elementUI的自定义上传
覆盖默认的上传行为,可以自定义上传的实现function在文档中存在这样一个自定义上传,但是在使用过程中出现了一些问题,action必填写,可以为’'字符串 :action='#':auto-upload=“false” 必须删除!!!默认就是true.改为false虽然不自动提交,但是因为action为’',所以它不会提交.
2024-01-11 16:30:18
1623
原创 uniapp的分包使用记录
UniApp的分包是一种将应用代码划分为多个包的技术。分包的核心思想是将不同部分的代码划分为不同的包,按需加载,从而提高应用性能。当用户打开应用时,只有当前页面所需的包会被下载和加载,这可以显著减少应用的启动时间和内存占用。通过使用分包功能,可以将主包中的一些不常用的页面或组件放到分包中,这样可以减少主包的体积,加快应用的启动速度和加载速度。一、创建你要的分包目录--例如创建pages_home目录。root的名字需要和你创建的分包目录一致。三、新建你要的分包文件。
2023-12-27 18:21:03
807
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人