2021年07月_一个橙子呀

原创前端—每天3道面试题（四）

每天进步一点点，努力就会到终点!一、CSS3 新特性有哪些?1.颜色：新增 RGBA，HSLA 模式2. 文字阴影:（text-shadow）3.边框：圆角（border-radius）边框阴影： box-shadow4. 盒子模型：box-sizing5.背景：background-size 设置背景图片的尺寸 background-origin 设置背景图片的原点background-clip 设置背景图片的裁切区域，以”，”分隔可以设置多背景，用于自适应布局6.渐变：linear-g

2021-07-29 09:39:12 248

原创前端—每天3道面试题(三)

每天进步一点点，前进不止一小点!一、v-for的时候为什么要使用key?Vue 使用v-for更新已渲染的元素列表时,默认用就地复用策略;列表数据修改的时候,他会根据key值去判断某个值是否修改,如果修改,则重新渲染这一项,否则复用之前的元素;因为vue组件高度复用，增加Key可以标识组件的唯一性，key的作用主要是为了高效的更新虚拟DOM;二、分别简述computed和watch的使用场景computed:　　　　当一个属性受多个属性影响的时候就需要用到computed　　　　例子：购物车

2021-07-28 10:19:49 160

原创前端—每天3道面试题(二)

每天进步一点点，波折烦恼都不见!一、前端优化性能的方法有哪些？1. 减少http请求数常用的减少http请求数有以下几种：合并图片。当图片较多时，可以合并为一张大图，从而减少http请求数。经常变化的图片可能不太合适，变化相对稳定的就可以考虑。合并大图除了能减少http 请求数外，还可以充分利用缓存来提升性能。合并压缩css样式表和js脚本，他们的共同目的都是为了减少http连接数。去掉不必要的请求。开发写代码或者系统升级之后残留的无效请求连接。充分利用缓存。这里说的缓存是客户端侧缓存或者说

2021-07-27 12:04:39 171

原创前端—每天3道面试题(一)

每天进步一点点,成长足迹看得见!一、overflow 有哪些属性值？Visible：默认值，内容不会被修剪，会呈现在元素框之外。Hidden：内容会被修剪，并且其余内容是不可见的。Scroll：内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。Auto：如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。Inherit：规定应该从父元素继承 overflow 属性的值。二、 rgba()和 opacity 的透明效果有什么不同？rgba()和 opacity 都能实现透明效果

2021-07-26 14:53:38 418 4

原创前端输出当天的日期方法

输出今天的日期，以 YYYY-MM-DD 的方式，比如今天是 2021 年7 月 22 日，则输出2021-07-22 ？控制台演示:今天是2021年7月23日哦

2021-07-23 14:35:10 585

原创父子组件传值的精简步骤

父组件代码html <selectEquipment @alreadySelectEquipment="alreadySelectEquipment" 子组件传过来的事件,进行注册 :compareList.sync="compareList" 传给子组件的值 ></selectEquipment>jsimport selectEquipment from "./components/select-equipment.vue";//引入子组件export def

2021-07-22 18:48:47 217

原创循环删除数组的某一项

点击删除,将数组的对应的一项删除 // 点击删除 deleteBtn(id) { //当前点击的id值 let len = this.alreadySelectEquipment;//data中保存的数组 for (let i = 0; i < len.length; i++) { if (len[i].id == id) { len.splice(i, 1); } } },.

2021-07-22 18:33:54 547

原创 Git开发中最常用的命令

git status 查看当前状态git add . 提交工作区文件到暂存区git commit -m"备注" 提交暂存区文件到仓库区git checkout - - <文件名> 从暂存区恢复某个文件到工作区git checkout . 恢复暂存区的所有文件到工作区git pull 拉取远程仓库代码(有冲突要解决冲突哦)解决好之后,再一次git add. git commit -m'' git pushgit push -u origin master 第一次提交需要这么写.

2021-07-21 14:47:45 101

原创 element-ui中隐藏滚动条el-scrollbar及修改滚动条颜色

<el-scrollbar></el-scrollbar>将会出现滚动的内容放到上述标签内就可以了。这里要简单的设置一下，将标签的height设为100%，查看效果的时候，会出现一个横向的滚动条，如果你不想要横向的滚动条，使用下面css属性设置就可以只显示竖向滚动条。/deep/.el-scrollbar__wrap { overflow-x: hidden;//将横向滚动条隐藏}/deep/.el-scrollbar__thumb { //可设置滚动条颜.

2021-07-20 14:18:15 4369

原创如何使用vue-table-with-tree-grid树形表格插件

1.安装插件npm install vue-table-with-tree-grid2.打开main.js，导入vue-table-with-tree-gridimport Vue from 'vue'import ZkTable from 'vue-table-with-tree-grid' Vue.use(ZkTable)3.全局注册//全局注册组件Vue.component('tree-table', TreeTable)4.使用组件展示分类数据:data(设置数据源.

2021-07-13 15:12:26 341

原创 element-ui中使用el-step步骤条实现忘记密码功能

效果图步骤条的使用比较简单,下面这是element官网的用法,我直接用代码展示如下:html:<template> <div class="page-container"> <div> <div class="title-img-wr"> <img src="../../assets/images/login/title.png" alt=""> </div>

2021-07-13 14:20:23 2278 2

原创注册页面提交验证-密保问题实现

实现页面需求HTML <div class="register-form"> <el-form ref="regForm" :model="form" :rules="rules" label-width="120px" class="demo-ruleForm" @submit.native.prevent> <el-form-item prop="account" label="用户名:"> <el-

2021-07-09 11:47:46 909 3

原创 VS Code 超级好用的插件

1.Chinese (Simplified) Language Pack for Visual Studio Code作用：中文翻译vscode2.Auto Close Tag作用：自动闭合html标签3.Auto Rename Tag作用：自动同步重命名标签4.Git History作用：查看Git历史记录5.javascript console utils作用：快速console.log和删除console.log使用：选择要打印的变量，然后使用快捷键Cmd + Shift

2021-07-08 18:58:34 747

原创 Cesium：入门教程（一）之 Hello World

下载与使用Cesium中文网提供最近版本的镜像下载地址:把包解压后如图所示：文件夹内含一个index.html，但双击并不能打开它,我们需要打开vscode编辑器下载依赖的npm模块,打开终端输入命令 npm install然后执行node server.js 或 npm start 就可以启动项目然后浏览器打开 http://localhost:8080/Apps/HelloWorld.html此时的页面上是没有地球的这时我们需要去官网 https://cesium.com/io

2021-07-08 12:26:12 349

原创 vue + elementUi中el-table表格高度自适应

首先html里设置table的高度<el-table ref="recordTable" :data="tableData" border :height="tableHeight"><el-table>data(){ return { tableHeight: 500 //默认初始值 }}根据浏览器高度设置初始高度，并监听浏览器高度变化，改变表格高度，70表示表格距离浏览器的高度mounted(){ this.$nextTick(() =>{

2021-07-07 16:14:11 1004

原创 element-ui的分页,添加首页、尾页,跳转按钮

要实现这要一个分页的效果HTML分页代码 <div class="user-pagination"> <el-button type="button" @click="jumpFirstPage" class="my-btn">首页</el-button> <el-pagination ref="pagination" background prev-text="上一页" next-text="下一页" la

2021-07-07 14:58:06 3610

原创 element-ui中修改table表格隔行变色的样式

/deep/ .el-table--striped .el-table__body tr.el-table__row--striped.el-table__row--striped.el-table__row--striped td { background-color: #233347; /*隔行变色*/ }另一个色值设置在html上 <el-table :data="tableData" stripe ..

2021-07-06 19:48:54 2259

原创 element-ui中修改分页的样式

默认样式效果图修改未选中背景和字体 /deep/.el-pagination.is-background .el-pager li:not(.disabled) { background-color: #0e1423; // 进行修改未选中背景和字体 color: #8fb1d2; border: 1px solid #4581ae; border-radius: 5px; width: 40px; height: 40

2021-07-06 19:45:20 3384

原创 element-ui中 table表格修改背景颜色

/deep/ .el-table, .el-table__expanded-cell { background-color: 你要设置的颜色; background-color: transparent;//这是设置透明背景色 }

2021-07-06 19:35:59 16447 12

原创 element-ui中 table表格改变鼠标悬停时的背景色

//样式穿透深度作用可以实现 /deep/ .el-table tbody tr:hover>td { background-color: 你要改变的颜色 }

2021-07-06 19:33:50 1893

原创数组遍历的几种方法及用法

一.for循环for(let i = 0;i<arr.length;i++){ console.log(arr[i]) }二.forEach方法forEach是最简单、最常用的数组遍历方法，它提供一个回调函数，可用于处理数组的每一个元素，默认没有返回值.不能使用return中止循环.使用break中止循环会报错以上是个简单的例子，计算出数组中大于等于3的元素的个数。回调函数的参数，第一个是处于当前循环的元素，第二个是该元素下标，第三个是数组本身。三个参数均可选。

2021-07-05 17:37:41 21307 2

原创 CSS实现文本一行垂直居中，两行垂直居中，超出两行文字显示省略号的方法

实现单行垂直居中，两行垂直居中，超过两行省略…显示<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> span{ display:-webkit-box; -webkit-line-clamp:2; .

2021-07-05 10:41:35 1732

小柠檬爱编程