![](https://img-blog.csdnimg.cn/20201014180756926.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端问题
好事总会发生在下个转弯
努力搬砖中。。。
展开
-
error ‘test‘ is assigned a value but never used no-unused-vars
1、相关报错信息error 'test' is assigned a value but never used no-unused-vars2、报错原因使用了eslint-loader进行了相关的语法检查,因为test变量没有被使用过,不符合相关的语法规则,则报错输出。3、关闭相关语法检查在相关项目的根目录下新建vue.config.js文件在vue.config.js文件中进行如下配置module.exports = { // 关闭语法检查 lintOnSave:原创 2021-12-06 15:14:08 · 1128 阅读 · 0 评论 -
js采用无分号代码风格容易引发的问题
当一行代码不在第一行,同时改行代码是以:( 、[ 、` 开头的时候,需要在改行代码的前面补上:; 或者 ! 或者~等,这样可以避免一些语法戒心错误。例如:console.log('test')(function () { console.log('hello')})()其输出的结果为:testVM257:3 Uncaught TypeError: console.log(...) is not a function at <anonymous>:3:1 (anonymous原创 2021-11-14 19:44:40 · 874 阅读 · 0 评论 -
有关于array.sort()的困惑
相关原因let arr = [1, 2, 3];arr.sort((a, b) => { console.log(a, b);})// 会发现其进行打印的为2 1;3 2当我们开始学习的过程中,了解到其应该打印的为1 2; 2 3。但是事实并非如此。同时了解在相关的array.sort(sortfunction)的方法的返回值时,如果返回值大于0,则会进行相关位置的交换;当返回值为小于等于0时则不进行相关位置的交换。通过相关的代码实践,发现事实却是相反的,除了等于0还是不会交换外。相关原创 2021-10-01 01:00:48 · 104 阅读 · 0 评论 -
Elementui蓝色阴影边框相关问题的解决方案
点击Tabs标签页出现蓝色阴影边框解决方案.el-tabs__item:focus.is-active.is-focus:not(:active) { -webkit-box-shadow: none !important; box-shadow: none !important;}点击el-button-radio出现蓝色阴影边框解决方案.el-radio-button:focus:not(.is-focus):not(:active):not(.is-disabled) { -webki原创 2021-09-08 10:20:33 · 1246 阅读 · 4 评论 -
当浏览器缩小时,el-dialog中的表单元素不能随之进行自适应
问题描述当el-dialog中嵌入form表单元素时,进行缩小浏览器时,相关的表单元素往外跑,不能很好的进行相关的自适应。问题解决方案定义相关的表单元素的宽度单位为百分比,这样能够使其很好的进行自适应布局。...原创 2021-06-17 15:13:45 · 977 阅读 · 0 评论 -
el-table自适应方式
el-table的简介el-table是elementui中的一个相关的表格样式,在这个相关的表格样式中可以为每一列定义相关的宽度。当将el-table中每一列表格宽度写死出现的问题当将el-table中的每一列宽度写死时,当缩小浏览器的大小时,表格布局容易错乱。解决方式自适应定义el-table的宽度,表格中相关每一列的宽度不写死,只写其中几列或者均不写死,这样相关的宽度都是自适应的。当缩小浏览器的大小时,表格的大小不容易发生错乱。...原创 2021-06-17 15:10:44 · 1519 阅读 · 0 评论 -
页面内嵌入iframe出现滚动条
一、问题出现原因iframe可以在原有的页面中嵌入一个新的页面,在所嵌入的新的页面中会出现相关的滚动条。二、问题解决方案直接控制iframe框架,使其不能出现滚动条。具体相关的代码如下所示:<iframe :src="srcUrl" frameborder="0" scrolling="no"></iframe>以上相关的关键代码为:frameborder="0" scrolling="no"...原创 2021-06-17 15:06:08 · 5612 阅读 · 4 评论 -
出现弹窗引起窗口抖动
一、问题出现原因当出现弹窗时,body元素中会新增padding-right: 6px;而当弹窗隐藏时,body元素中不会新增padding-right: 6px;这一css属性样式。二、问题解决方式在body元素中新增padding-right: 0 !important;这一属性。即:body { padding-right: 0 !important;}...原创 2021-06-17 15:00:59 · 653 阅读 · 0 评论 -
el-tooltip导致窗口抖动
问题描述随着el-tooltip的显示与隐藏,窗口出现相关的抖动。问题产生的原因el-tooltip占有一定的高度,当el-tooltip显示时,会导致相关滚动条的显示。当el-tooltip隐藏时,会导致相关的滚动条隐藏。然后随着el-tooltip的交替显示与隐藏,滚动条也会交替的显示与隐藏,导致窗口出现抖动。问题解决方案在body中添加overflow: hidden;的css属性,使得其相关的滚动条不再出现。即:body { overflow: hidden;}...原创 2021-06-15 16:33:23 · 2652 阅读 · 5 评论 -
css布局常见问题
一、宽度设置问题在设置相关元素的宽度时,为了考虑到相关的适配问题,故不能将宽度写死,往往将宽度的单位设置为%或者vw。注意:%单位的定义是针对父元素而言的。vw单位是针对视口宽度而言的。二、高度设置问题在整体布局的高度设置中不用过多的考虑布局问题,因此需要将高度写死,此时常使用px单位。(在浏览器中常出现滚动条来进行相关的调节)。同时相关的px写常使用与竖直方向,比如相关的margin-top、margin-bottom、top与bottom方向的设置。在整体布局中不将高度写死出现的问题:原创 2021-06-15 14:57:00 · 465 阅读 · 0 评论 -
el-tooltip数据更新后提示框不能进行显示
问题代码如下<el-tooltip :content="data.name" :disabled="showSelected" placement="bottom" effect="light" > <div class="name" @mouseover="mouseOver(data)" v-if="data.name !== data.originname"> <span>{{data.name}}</span> &l原创 2021-06-15 10:33:19 · 1267 阅读 · 0 评论 -
div嵌套将嵌套内的div改成inline-block属性问题
问题示例代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> #main { border: 1px solid black; } #main > div {原创 2021-06-14 19:29:00 · 608 阅读 · 0 评论 -
flask框架中无法正常显示背景图
问题描述在flask中使用img引入图片时,图片不进行相关的显示。解决方案在Flask的项目文件下新建static文件夹,然后将图片放在static文件夹下。其相关的src属性具体赋值如下所示 img.src = "{{ url_for('static', filename = 'chessBoard.png') }}"注意:chessBoard.png为背景图片名...原创 2021-05-14 17:06:21 · 2209 阅读 · 0 评论 -
background-color和color的区别
1、功能不同background-color用于设置背景颜色,而color用于设置字体的颜色。2、范围不同background-color属性所设置的颜色会填充元素的内容、内边距和边框区域,扩展到边框的外边界(不包括外边距)。color属性设置了一个元素的前景色,在HTML中就是元素的文本颜色。光栅图像不受color影响。这个颜色可以应用到元素的所有边框,但是当设置了border-color的颜色时,其将显示所设置的border-color属性的颜色。即border-color所设置的颜色会覆盖co原创 2021-03-26 21:58:06 · 3173 阅读 · 0 评论 -
css盒子模型中的background-color能控制的颜色范围
css盒子模型中的background-color能控制的盒子模型内的content、padding和border中的颜色。当将border中的颜色设置为transparent,即透明时,border所呈现的颜色就是background-color属性中所定义的颜色。当border中的border-color属性不是transparent时,border中的颜色即以其所设置的颜色进行呈现,覆盖掉background-color中的颜色。...原创 2021-03-26 20:33:07 · 1508 阅读 · 0 评论 -
在CSS中top、left、right和bottom属性设置无效果
top、left、right和bottom属性设置没有作用的原因position属性一般配合top、buttom、left和right来使用。元素只有在定义position属性(除了static)之后,top、buttom、left和right才有效。注意:position属性的值为static时,设置top、buttom、left和right属性时不会产生任何效果。同时position的默认属性为static,即在不设置position属性的情况下,position的值为static。...原创 2021-03-26 19:18:10 · 2205 阅读 · 0 评论