- 博客(73)
- 资源 (1)
- 收藏
- 关注
原创 vue v-if和key值的注意的地方
通过为每个元素分配一个唯一的key,Vue能够在数据变化时准确地追踪到哪个元素发生了变化,从而更新相应的节点,而不是重新渲染整个列表。:如果不为列表项指定唯一的key,Vue会默认使用索引作为key,这在列表项顺序会发生变化的情况下可能会导致渲染错误。的比较和更新过程会利用这个唯一标识符来快速定位和更新相应的节点,而不是逐个比较所有节点,从而减少不必要的DOM操作,提高渲染效率。通过正确使用key属性,可以显著提高Vue应用的性能,并确保在动态更新和重新渲染时的正确性。只是简单的基于css切换。
2025-01-17 16:24:35
557
原创 vue父子组件传值,复杂类型传值导致父组件数据错误
问题:父组件传子组件值时,若传复杂类型对象或数组时,相当于把源数据传给了子组件,子组件改变这些数据,会引发父组件数据发生变动,引起错误。若在父组件深度监听该复杂数据时,会得到变动的数据。
2024-11-21 10:58:55
164
原创 el-table 表格索引不展示问题
问题:el-table,前端将dom结构传给后端,在另一个页面获取这个dom,渲染,一开始,列表样式全部挤到一起,样式错乱。若表格有初始化是隐藏的,需要事件点击显示的 则表格索引会消失。
2024-11-07 15:57:03
433
原创 ERR_PACKAGE_PATH_NOT_EXPORTED]: No “exports“ main defined
要修改node_modules@babel\helper-compilation-targets\package.json 下的。克隆代码,发现运行报这个错,仔细搜了下。
2023-12-18 17:06:05
864
原创 vue 父组件传的值,子组件模板中能渲染,但是mounted不能打印
原因: 这是因为子组件挂载的时候,值在父组件里也是为空的,后来父组件做了请求之类的工作后,更新了这个值然后往子组件里面传递,所以开始挂载的时候是值是空的,后来才有值,所以html看起来能渲染出来,实际它之前渲染过一次空的了,只不过两次时间间隔可能比较短。问题:vue 父组件传的值,子组件模板中能渲染,但是mounted打印出来为空,解决的方法是用watch 来监听Props中的数据然后做出响应的操作。方法二、用watch 来监听Props中的数据然后做出响应的操作。
2023-11-29 17:03:11
545
原创 vue 微信分享
一个h5界面要求点击右上角三个点后点击微信好友分享带标题和图片给好友。vue项目中,分享携带头部标题、简介和缩略图等信息。
2023-08-17 10:00:52
1568
2
原创 vue 图片的引入方式
可以理解为一个全局方法,是一个方法就意味着可以在任何地方执行。是赋值过程并且是运行时才执行,引入文件时,导出的文件方式不一样,是解构过程并且是编译时执行。二、require 动态引入。一、import 静态引入。放在script标签顶端。必须写在文件的顶部。
2023-07-25 17:13:54
563
原创 vue2响应式原理理解
1、一句话,vue2的响应式是通过Object.defineProperty添加get和set方法,把data中的数据变成响应式的,然后使用发布订阅模式(观察者模式)进行依赖追踪。watcher 监听,让dep知道谁在用它,也就是当用到响应式数据时,该数据不知道哪个方法用到了它。Dep 依赖收集,读取属性时,记录谁使用了。属性发生了变化,通知使用到该属性的地方。Observe 封装的方法,把data中的属性转为响应式的。computed watch v-model 实现原理。
2023-07-21 16:49:39
159
原创 git 设置库的问题
跳出 .npmrc 记事本 改镜像为 registry=https://registry.npm.taobao.org/ 淘宝或其他镜像。1、删除当前文件下的node_modules依赖包。3、改变镜像 npm config edit。原因:npm源指向的问题。2、重新安装 npm i。4、再次执行npm i。
2023-05-23 08:58:32
93
原创 vue3 刻度尺 联动
目前没找到vue3 的刻度尺插件,在网上找了一个用canvas写的,改改东西,就满足要求了。这是ruler.js文件,封装成js文件,调用即可。接下来,在vue中引入,然后使用。
2023-05-09 16:48:26
1691
原创 封装el-dialog 注意子组件参数变化
1.父组件的写法<dialog :upload-visable.sync="dialogFormVisible"></dialog>2 子组件的写法;①父组件传过来的值uploadVisible,子组件:visible.sync 不要直接使用,:visible.sync 重新定义一个变量,用watch 监控去关联两者的关系如果不暂存,会报 Avoid mutating a prop directly since the value will be overwritte
2022-05-23 14:48:54
526
原创 img 行内元素 margin:0 auto; 使用条件
1、img是行内元素img属于可替换元素,在css中可替换元素的展示效果是不由css来控制的 可替换元素是一种外部对象,它们外观的渲染,是独立于css的。 css可以影响这些元素的位置但是不能影响元素本身的样式可替换元素: frame 、video、img2、margin:0 auto; 使用条件必须块内元素、有宽度img 使用margin:0 auto;居中需加 display:block; 还得设置宽度...
2022-05-22 18:57:16
541
原创 vue中控制滚动条移动
业务要求,tab切换栏宽度固定,长了的话加滚动条,要求通过点击事件控制左右移动目前想到的是控制滚动条移动就行了,使用scrollTo方法, <div class="layout" id="out"> <div class="b">标题1</div> <div class="b">标题2</div> <div class="b">标题3</div> <div c
2022-05-18 20:42:42
2817
1
原创 echarts 瀑布图(简单的k线图)
准备数据// xianZhongFallList:[13.47, 0.11, 0.02, 0.42, 0.63, 0.59, -0.47, 0.39]// xianZhongFallXxais:['行业增速', '家用交强件数影响', '家用交强件均影响', '家用商业件数影响', '家用商业件均影响', '商用件数影响', '商用件均影响', '结构影响', '主体增速']主要在于先处理数据,pageInit1() { var echarts = this.$echar.
2022-05-07 19:22:58
1231
原创 vant-picker级联问题
级联时主要注意一级二级之间的联动,需要一个方法处理,其他的跟单列的相同<div class="content"> <div @click="openPicker()">{{pickerValue}}</div> <van-popover v-model="showPicker" position="bottom"> <van-picker :columns="columns" show-.
2022-05-06 17:29:56
1245
原创 echarts 暂无无数据简单写法
使用title属性,减少了操作只需判断data数据即可title: { show: data.length == 0, // 没数据才显示 extStyle: { color: "grey", fontSize: 20 }, text: "暂无数据", left: "center", top: "center"} ...
2022-05-06 17:19:08
501
spring jar包
2017-12-26
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人