vue
清幽子
Striving upwards is a good habit
展开
-
js浅拷贝和深拷贝
0bject.assign () 方法会将source里面的可枚举属性复制到target,复制的是属性值如果属性值是一个引用类型,那么复制的是引用地址,因此也属于浅拷贝。通过上例可以看出浅拷贝虽然复制出了一个新的数组,但是当数组的元素为引用数据类型时,浅拷贝只拷贝了地址,通过原数组改动这个地址指向的数组,新数组同样也会发生变化。通过上例可以看出深拷贝是每一个层级都在堆内存中开辟了新的空间,是拷贝了一个全新的数组或对象,不会受原数组或原对象的影响。// false,即使是数组里第二层级的数组也是不相同。原创 2023-07-20 14:44:44 · 274 阅读 · 0 评论 -
vue的虚拟DOM和diff算法
vue虚拟DOM和diff算法的理解原创 2022-12-20 11:14:13 · 693 阅读 · 1 评论 -
vue3的tabs选项卡的制作
tabs选项卡原创 2022-06-13 11:07:39 · 3348 阅读 · 0 评论 -
vue3面包屑导航的制作
vue3,route.matched,面包屑导航原创 2022-06-11 16:50:34 · 3294 阅读 · 0 评论 -
element plus动态引入图标
vue3原创 2022-06-11 10:44:05 · 1114 阅读 · 0 评论 -
vue3+ts通过lodash实现防抖节流
安装lodashnpm i --save-dev @types/lodash在组件中引入lodashimport * as _ from 'lodash'防抖_.debounce(func, [wait=0], [options=]) 函数在延迟几毫秒之后才执行,也就是停止改变几秒后执行参数func (Function): 要防抖动的函数。[wait=0] (number): 需要延迟的毫秒数。[options=] (Object): 选项对象。[options.leadi原创 2022-05-02 16:27:47 · 5917 阅读 · 0 评论 -
element-ui Notification 通知文字换行
换行代码如下: let success='', fail=''; for(let o in res.data.ToSuccess) { success += res.data.ToSuccess[o] + " " } for(let p in res.data.ToFailure) {原创 2022-04-01 10:51:01 · 2132 阅读 · 0 评论 -
el-upload上传文件实现视频上传
上传成功后,下面的滚动条和文件名消失 <el-form-item label="上传视频" prop="videoPath" :required="videoTo"> <el-upload ref="video" class="upload-demo" v-model="form.videoPath" drag action="/api/ETool.原创 2021-08-26 22:26:07 · 6415 阅读 · 1 评论 -
el-admin封装的crud,在created中拿不到数据,拿数据的方法
首先,created只在重新加载时调用一次 即第一页的数据,当在页面点击分页按钮,不会调用,所以之后页面的数据无法获取。点击分页标签中的页数,会调用crud中刷新的方法,调用接口,拿到本页的数据用刷新后生命周期函数获取数据,在里面用this.crud.data可以获取到数据。 methods: { [CRUD.HOOK.afterRefresh]() { var data = this.crud.data; console.log(data, "data");原创 2021-08-16 17:12:50 · 1412 阅读 · 0 评论 -
vue中echart图表y轴左边数值,右边百分比
实现代码如下(有注解解释): //bar export default { getBarData() { let getBar = echarts.init(document.getElementById("bar")); var option = { legend: {}, tooltip: {}, dataset: { source: [ ["product", "正确数",.原创 2021-07-30 21:43:27 · 2230 阅读 · 3 评论 -
vue中怎么使用echart图表
首先 npm install echarts --save在页面中,写入dom<div id="chart" style="width: 100%; height: 600px"></div>import * as echarts from 'echarts';export default {//调用getEchartData方法 mounted() { this.getEchartData(); }, methods: { get原创 2021-07-30 16:03:34 · 312 阅读 · 0 评论 -
el-select实现动态从后台获取,遍历写出选项
首先,在data中声明一个值 data() { return { dishesInfoList: [], } }其次,在查询遍历列表信息的接口中获取数据 listDishesInfo(this.queryParams).then(response => { this.dishesInfoList = response.data; });之后,在el-form中写上 : data;在el-select中写上v-model(写不写都原创 2021-04-11 16:08:39 · 4944 阅读 · 0 评论