![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端学习
糖醋麻辣
因为热爱。
展开
-
vue脚手架搭建项目报错
vue create is a Vue CLI 3 only command and you are using Vue CLI 2.9.6原创 2022-12-05 11:03:20 · 710 阅读 · 0 评论 -
ElementUI:多个Select下拉框存在时调整个别下拉框样式
当dialog中存在多个下拉框的时候,想改变某一个下拉框的样式,于是给某一个select绑定类,发现并没有生效,换了一种方法,将el-select用div包裹,将类绑定在div上,也没有效果。在控制台查看后发现,下拉框出现后与app同级查阅ElementUI下拉框文档之后,在文档中提到popper-class,给下拉框添加类名,于是在需要改变样式的那个select下拉框绑定popper-class,用popper-class来自定义一个类获取到类名之后,就能对想修改样式的下拉原创 2021-03-06 10:02:03 · 777 阅读 · 1 评论 -
ES6:学习笔记
函数默认参数之前:function show(a,b){ a=a||'is a'; b=b||'is b'; console.log(a,b);}show('aaa','bbb')show('aaa')1.函数默认参数function show({x=0,y=0}={}){ console.log(x,y);}show();2.函数参数默认已经定义了,不能再使用let,const声明function show(a=18){ le原创 2021-03-04 15:05:30 · 588 阅读 · 0 评论 -
ElementUI:通过按钮控制Tabs标签页的左右切换
实现效果:给左右按钮绑定add()和sub()事件,控制左切or右切<template> <div class="xiangyou" @click="add()"></div> <el-tabs v-model="activeName" type="card" @tab-click="handleClick"> <el-tab-pane label="用户管理" name="first">用户管理</el-t..原创 2021-02-03 17:50:43 · 6309 阅读 · 0 评论 -
ElementUI:遮罩层遮盖全屏的问题
问题描述:在设置Dialog对话框的时候遮罩层覆盖全屏,期望实现的效果是对话框显示,对话框之外被遮罩层覆盖。问题分析:ElementUI官方文档中对于append-to-body属性描述:Dialog 自身是否插入至 body 元素上。嵌套的 Dialog 必须指定该属性并赋值为 true。在嵌套Dialog场景中,将内层 Dialog 的该属性设置为 true,它就会插入至 body 元素上,从而保证内外层 Dialog 和遮罩层级关系的正确问题解决:在el-dialo原创 2021-01-28 11:44:56 · 3603 阅读 · 0 评论 -
ts:学习总结
TSTypeScript是什么TypeScript是JavaScript的超集。(比JS多了一个类型系统)与JS相比的优势:.类型化思维方式,使得开发更加严谨,提前发现错误,减少改Bug时间.类型系统提高了代码可读性,并使维护和重构代码更加容易.补充了接口、枚举等开发大型应用时JS缺失的功能安装解析TS的工具包-在vscode终端-命令:npm install -g typescripttypescript:就是用来解析ts的工具包,提供了tsc命令,实现了TS原创 2021-01-18 18:36:40 · 1216 阅读 · 0 评论 -
npm:安装依赖时报错cb() never called!
刚接到项目npm install的时候出现如下报错第一步:以管理员模式打开cmd清除npm缓存:npm cache clean -f报错:通过指令查看缓存地址:npm config get cache根据查到的地址可以看到里面是没有__cacache文件夹的,说明缓存已经清过了如果清除npm缓存没有成功,文件夹是长这个样子的(存在一个_cacache文件夹):第二步:安装最新版本的Node helpernpm install -g n报...原创 2021-01-12 14:41:36 · 1382 阅读 · 1 评论 -
Echarts:Watch数据与option数据冲突导致的死循环
echarts图表定义在子组件中,父组件从后台得到数据后再给子组件传值。因为ajax请求是异步的,执行顺序为echarts绘制然后父组件才得到数据传给echarts子组件,所以在echarts中不会渲染数据,因此我在子组件中用Watch来监听父组件传递的值的变化。 // 监听获取数据的变化 @Watch("dataX") onDataXChange(newDataX: string[], oldDataX: string[]) { this.dataX = newDataX;原创 2021-01-08 18:06:31 · 584 阅读 · 0 评论 -
CSS:修改默认滚动条样式
默认滚动条样式:修改后滚动条样式:/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/::-webkit-scrollbar { width: 10px; background-color: #054373;}/*定义滚动条轨道 内阴影+圆角*/::-webkit-scrollbar-track { background-color: #034f78;}/*定义滑块 内阴影+圆角*/::-webkit-scrollbar-thumb { border-.原创 2021-01-08 16:04:52 · 163 阅读 · 0 评论 -
Echarts:父组件中两次调用echarts子组件只渲染一个问题
当echarts图表定义在子组件中,父组件在同一个页面两次调用子组件渲染页面时,只有最后一个子组件被渲染,这是因为在子组件里面是document.getElementById(),而dom里面只有一个id,所以一个id把另一个id覆盖了导致其中一个子组件无法显示。这时,在子组件中不用id,用ref。<div class="chartBar" ref="bar"></div>初始化echarts如下: const chart: any | null = this.$原创 2021-01-06 15:30:24 · 1476 阅读 · 4 评论 -
Echarts:图表作为子组件监听父组件窗口的大小
实现效果:当父组件页面拖动时,echarts图表监听窗口大小 变化,在子组件中跟随父组件大小变化。首先用Watch监听窗口大小的变化 @Watch("visible") onVisibleChange(v: boolean) { console.log(v); this.resize(); }绘制echarts图表函数 drawChartBar(): void { const chart: PdCAny | null = this.$refs["...原创 2021-01-06 15:00:20 · 654 阅读 · 0 评论 -
vue-seamless-scroll滚动插件的使用
一、安装npm install vue-seamless-scroll –save二、在main.ts中全局挂载import vueSeamlessScroll from 'vue-seamless-scroll'Vue.use(vueSeamlessScroll)三、在要使用该插件的子组件中引入import vueSeamlessScroll from "vue-seamless-scroll";@Component({ components: { vueSeam原创 2021-01-06 14:28:42 · 4609 阅读 · 5 评论 -
Echarts:坐标轴全称过长的省略及显示
Echarts中的xAxis.axisLabel.formatter可以定义x轴的刻度标签内容格式,支持字符串模板和回调函数两种形式。官方示例:// 使用字符串模板,模板变量为刻度默认标签 {value}formatter: '{value} kg'// 使用函数模板,函数参数分别为刻度数值(类目),刻度的索引formatter: function (value, index) { // 格式化成月/日,只在第一个刻度显示年份 var date = new Date(val原创 2021-01-06 11:59:02 · 2940 阅读 · 0 评论 -
Echarts:重写toolbox的还原工具并监听click事件
Echarts中的toolbox.feature提供了部分图标,比如saveAsImage 保存图片restore配置项还原dataView数据视图工具,可以展现当前图表所用的数据,编辑后可以动态更新。dataZoom数据区域缩放,目前只支持直角坐标系的缩放。magicType动态类型切换brush选择组件的控制按钮等。配置代码:toolbox: { show: true, feature: { dataZoom: { ...原创 2021-01-05 15:54:45 · 6146 阅读 · 2 评论