- 博客(47)
- 资源 (8)
- 收藏
- 关注
RSS订阅原创 数组中的最大值和最小值
使用Math.max () 和 Math.min()var arr = [1,2232,895,56,5659]console.log(Math.max(...arr)) //5659var num = [12,56,89,[12212,5656,568999]]console.log(Math.max(...num)) // NaN
2021-03-31 17:28:32
126
原创 css中的百分比
今天发现：最初对百分比的概念理解是不对的，并不是对父元素相对而言的百分比，如果父元素有padding就不一样了语言表达的不清不楚，上代码，看现象：<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="
2021-03-31 15:40:05
276
原创 vue中哪些数组方法不是响应式的
何为数组的响应式通过方法把数组中的元素改变了，页面上的视图也会更新。响应式的方法div id="app"> <div v-for="item in letters">{{item}}</div> <button @click="btnClick">按钮</button></div><script src="../js/vue.js"></script><script>
2021-03-30 16:44:38
1510
原创 vue-quill-editor
vue项目中富文本编辑器的使用1、引入npm install vue-quill-editor --save在那个组件中用就在那个组件中引入import 'quill/dist/quill.core.css'import 'quill/dist/quill.snow.css'import 'quill/dist/quill.bubble.css'import { quillEditor } from 'vue-quill-editor'export default { compone.
2021-03-30 10:59:32
477
原创 在函数中声明的变量
javascript语言中，在函数中声明的变量在函数执行进行一创建，当函数执行完毕的时候就会被销毁掉。<script> function getName () { var name = "凡夫俗子"; console.log("函数体访问",name) } getName() ert(name) </script>变量name是在函数中使用var定义的。当函数被
2021-03-26 13:08:37
966
原创 关于第三方图片资源403问题
应业务需求：问题： 文章列表数据中的好多图片资源请求失败，返回403原因：这是因为我们项目的接口数据是后端通过爬虫抓取的第三方平台内容，而第三方平台对图片资源做了防盗链保护处理。第三方平台怎么处理图片资源保护：服务端一般使用 Referer 请求头识别访问来源，然后处理资源访问Referer 是什么东西，详情见阮一峰老师的博客Referer： 介绍人，推荐人。谁引荐了你？对于公司来说，这是很有用的信息。互联网也是一样，你不会无缘无故访问一个网页，总是有人告诉你，可以去那里看看。服务器也想知
2021-03-25 10:38:30
189
原创 从URL地址中获取参数
浏览器宿主环境中，有一个宿主对象，同时这个对象也是window对象和document对象的属性，location对象中提供了与当前窗口加载的文档有关的信息，即URL信息；如：https://www.baidu.com/api/sousu?search=baidu&id=123#2location.herf:完整的URLlocation.protocol:返回协议（https:）location.host:返回服务器名称和端口号（www.baidu.com）location.
2021-03-22 18:41:12
690
原创 js中||和&&的三层理解
||与&&用法的三层境界，你属于哪一种？1、简单的布尔值判断 true||false2、表达式转换为布尔值进行一个判断 var a = 1; var b = 2; a1 || b33、短路运算符
2021-03-21 17:42:50
234
原创 es6导出导入语法(一篇就够)
模块封装代码javascript用 “共享一切的” 方法加载代码，是这门语言最容易出错的地方。Web应用程序变得更加复杂，JavaScript代码的使用量也开始增长，变量命名足以让人头秃。ECMAScript 6的一个目标是解决作用域问题，也为了使JavaScript应用程序显得有序，于是引进了模块默认导出与默认导入(注意：默认导出在一个模块中只能有一次)//导出let a = 10let c = 20let d = 30function show() { console.log(
2021-03-21 16:13:47
1028
原创 获取最近的七天时间
业务需求：代码处理： //整理时间格式，整理出自己想要的几月几号以及星期几 handleTiem(date) { var time = { riqi: "", week: "" }; time.riqi = date.getMonth() + 1 + "/" + date.getDate(); switch (date.getDay()) { case 0: time.week = "周日"; brea
2021-03-21 15:22:54
258
原创 有滚动效果但是不要滚动条
很简单，只需要给你想要有滚动效果但是却不要滚动条的容器设置以下css属性：::-webkit-scrollbar { display: none;}
2021-03-21 15:14:41
285
原创 Uncaught (in promise) TypeError: Object(...) is not a function
报错原因：es6的导入导出语法使用错误。export和import的使用方式。
2021-03-20 15:38:09
1648
原创 vue路由传参页面刷新所传参数消失
因业务需要发现如下问题：业务描述：点击师弟的前往评分，然后使用路由传参将师弟的id给传过去。然后在师兄打分页面进行一个操作。发现问题：在师弟页面进行页面刷新之后，就会发现，没有数据了，原因排查发现，页面刷新后，路由传参过来的id没有了。进而导致请求不到数据，进行一些数据操作请求发送不出去。问题解决：将路由传参获取到的数据，存储到本地。window.sessionStorage.setItem("sdId",this.$route.params.userId)...
2021-03-19 16:35:13
203
原创 父子组件生命周期执行顺序
谈到一个模板的生命周期执行顺序我们每个人都可以谈的津津有味，但是父子组件的生命周期执行函数是怎样的呢？父子组件生命周期执行顺序：父组件代码：<template> <div> <mo-ban></mo-ban> </div></template><script>import moBan from './moban'export default { components: { m
2021-03-19 10:33:18
312
原创 计算属性与侦听器
计算属性：有返回值，不能执行一个函数，created阶段就会直接就起作用。侦听器：不需要返回值，可以执行一个函数，created阶段不起作用所监听的值变化了其才触发
2021-03-18 17:13:08
106
原创 兄弟组件之间调用方法
业务需求： 要在router-view这个路由出口的组件中调用 aside-left组件中的方法。理清关系：aside-left组件和router-view之间是兄弟组件的关系；router-view与它的出口组件之间其实可以看作父子组件；总结：兄弟组件之间调用方法：组件上用ref进行表示 ==> this.$refs.child1Container.selectZonghenengli();总结构:<template> <el-container class=
2021-03-18 17:04:41
1991
原创 nth-child()、nth-of-type
下午工作恰巧因为业务需求一股脑用到了这css几个选择器就详细的写一下。首先这几个选择器叫做伪类选择器（标志就是 :） 伪元素选择器（标志是 ::）代码：html: <ul> <li>一曲二三里</li> <li>烟村四五家</li> <li>亭台六七座</li> <li>八九十枝花</li> </ul>css：
2021-03-18 14:20:56
112
原创 Vue中父组件向子组件echarts传值问题
问题描述：vue中子组件是echarts图表，父组件向子组件利用props传值，值传递过去了，但是，echarts不渲染。问题现象再深一层次：数据没有驱动试图解决办法：用v-if进行一个渲染判断上代码：父组件<template> <div class="putongradar_container"> <div class="container_left"> <div class="title">{{ zonghNengl
2021-03-17 13:31:36
1535
原创 The data property “seniorRating“ is already declared as a prop. Use prop default value instead
报错：The data property “seniorRating” is already declared as a prop. Use prop default value instead原因：在父组件中定义的自定义属性往子组件中传值的时候，子组件中的data中也命名了一个相同的。解决办法：将子组件中data中的变量去掉即可...
2021-03-17 12:13:09
363
原创 删除一个数组中的元素
删除数组中的一个元素：1、屡试不鲜的应该是splice()搭配indexOf() var arr = ['red','bule','yellow','green'] //去除bule项 arr.splice(arr.indexOf('bulu'),1)这种方法只适用于简单的数组，如果碰上数组对象就不行了。2、splice()搭配forEach()var arr = [{positionId: 1, hotspot: 2, capacityId: "3", technique: "Mybat
2021-03-16 11:09:04
401
原创 Uncaught (in promise) TypeError: Object(...) is not a function
原因是：导入的时候忘记了带大括号import {getuserInfo} from '@/api/login'
2021-03-15 14:10:34
1159
原创 el-select，el-input__inner，el-input__suffix样式修改
上图：项目：vue + element问题：element虽好，但是样式修改起来是真的费劲。总结：el-select的宽度是默认充满容器的所以只需要设置高度即可css样式：//对整个容器进行设置 .el-select /deep/ .el-input__inner { height: 44px; border: none; margin-top: 24.5px; font-size: 18px; font-family: Source Han Sans
2021-03-11 18:14:58
7807
原创 Uncaught SyntaxError: Invalid shorthand property initialize
控制台报错：Uncaught SyntaxError: Invalid shorthand property initialize翻译报错：未捕获的SyntaxError:初始化的速记属性无效Invalid：无效的shorthand：简写initialize：初始化原因：这里的等号应该改为 ： 即改为 size：“10”...
2021-03-11 10:01:46
836
原创 空对象转换为布尔类型是true
对象（包含空对象）转换为布尔类型 都是trueNaN表示不是一个数字 但是用typeof测NaN显示其实际上是一个数据类型
2021-03-10 11:53:14
862
原创 if语句中什么时候可以省略大括号？
有大括号的时候大括号里面所有的 都归if管。只有条件为真的时候 才会执行。没有大括号的时候 只有下面的 一句 归if管，也就是说 当只有一句的时候 大括号可以省略 其它的 没区别//注意观察此代码中的if语句 login() { this.$refs.loginFromRef.validate(async (valid) => { //登录前的一个预验证 // console.log(valid) if (!valid) retur
2021-03-10 10:13:49
6058
原创 click.native（vue中给子组件绑定事件）
问题阐述：vue中最大的特色莫过于组件化，让我们的代码可以插拔式的应用，但是组件怎样绑定事件呢，有很多复杂化的做法，今天发现一个简单的办法1、给vue组件绑定事件时候，必须加上native ，不然不会生效（监听根元素的原生事件，使用 .native 修饰符）。2、等同于在自组件中：子组件内部处理click事件然后向外发送click事件：$emit(“click”.fn)代码：<template> <div class="putongziping_container">
2021-03-09 16:10:21
1317
原创 Cannot read property ‘$message‘ of undefined
项目：vue＋element场景：在系统登录进行axios调用的时候，如果请求成功会有消息提示框，提示登录成功。控制台报错：Cannot read property ‘$message’ of undefined原因:vue实例中this指的是vue本身，通过this就可以调用vue对象的所有api。出现上述问题则说明，当前的this对象发生了改变，无法调用$message方法。箭头函数并不简单是匿名函数的简写：在JS中，箭头函数和匿名函数有一个明显的区别：箭头函数内部的this是词法作用域，在
2021-03-09 15:30:41
9511
1
原创 文字少的时候居中显示，文字多的时候在左边显示（某个模块文字多少是动态的）
html:<div class="box"> <p id="conMore" class="content">文字内容-新增文字-新增文字-新增文字-新增文字-新增文字-新增文字</p></div>css:.box { padding: 10px; background-color: #cd0000; text-align: center;}.content { display: inline-block; text-ali
2021-03-05 15:43:58
135
1
原创 swiper组件使用异常
现象描述：点击左右按钮不生效 用鼠标划页面能划得动 过一会左右按钮生效了。解决办法：observer:true,observeParents:true
2021-03-05 15:30:45
189
原创 两组经纬度算出两地相距距离
//lat是英文单词latitude的缩写,意思是纬度;lng是英文单词longitude的缩写,意思是经度function distance(lat1,lng1,lat2,lng2) { var radLat1 = lat1*Math.PI / 180.0; var radLat2 = lat2*Math.PI / 180.0; var a = radLat1 - radLat2; var b = lng1*Math.PI / 180.0 - lng2*Math.PI / 180.0;
2021-03-05 15:28:31
230
原创 单行超出隐藏有省略号，多行超出隐藏有省略号
单行超出隐藏有省略号://不换行white-space: nowrap;//超出隐藏overflow: hidden;//超出部分用...代替text-overflow: ellipsis;多行超出隐藏有省略号:display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;text-overflow: ellipsis;...
2021-03-05 15:18:18
204
原创 location.hash
前端路由跳转，核心实现依靠一个事件，即监听hash值变化的。 window.onhashchange = function(){ //location.hash可以获取到最新的hash值 location.hash}
2021-03-05 14:00:22
120
原创 45个有用的JavaScript技巧，窍门和最佳实践
1、首次为变量赋值时务必使用var关键字变量没有声明而直接赋值得话，默认会作为一个新的全局变量，要尽量避免使用全局变量。2、使用===取代====和!=操作符会在需要的情况下自动转换数据类型。但===和!==不会，它们会同时比较值和数据类型，这也使得它们要比==和!=快。[10] === 10 // is false[10] == 10 // is true'10' == 10 // is true'10' === 10 // is false [] == 0
2021-03-04 16:11:56
113
1
原创 vue路由懒加载
为什么需要路由懒加载：当打包构建应用时，JavaScript 包会变得非常大，影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件，这样就更加高效了。没有使用路由懒加载之前和路由懒加载之后：import Vue from 'vue'import Router from 'vue-router'// import Login from './components/Login.vue'const Login = () => import(/*
2021-03-04 15:44:47
433
2
原创 vue指令大全
v-html：template:<div>{{rawHtml}}</div><div v-html="rawHtml"></div>data:rawHtml: '<span style="color:blue">fanfusuzi</span>'尽管如此，你不能使用 v-html 来复合局部模板，因为 Vue 不是基于字符串的模板引擎，反之，对于用户界面 (UI)，组件更适合作为可重用和可组合的基本单位。你的站点上
2021-03-04 15:01:23
82
1
原创 input框样式调整（一篇搞定）
效果图：直接上代码：<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
2021-03-03 16:56:00
734
1
原创 javascript语句和表达式的区别
表达式：表达式是值、变量和运算符的组合一个表达式可以产生一个值，有可能是运算、函数的调用、有可能是字面量。表达式可以放在任何需要值的地方。算数表达式：1+2包含变量的表达式：x + 2赋值表达式： x=2逻辑表达式： 5>2三元表达式： 5>2 ? true:false语句：JavaScript语句由以下构成: 值、运算符、表达式、关键字和变量名。这5项不是必须同时存在。大多数JavaScript程序都包含许多JavaScript语句。这些语句会按照它们被编写的顺序逐一执行
2021-03-03 14:57:10
546
1
原创 字符串substr方法，字符串substring方法
写在前面：很希望大家在学习这写东西的时候一定要看比较官网的文档：MDN，自己去查一查。官方警告：尽管 String.prototype.substr(…) 没有严格被废弃 (as in “removed from the Web standards”), 但它被认作是遗留的函数并且可以的话应该避免使用。它并非JavaScript核心语言的一部分，未来将可能会被移除掉。如果可以的话，使用 substring() 替代它.作用:substr()方法返回一个字符串中从指定位置开始到指定字符数的字符语法:
2021-03-03 14:25:23
2339
原创 elementUpload组件上传功能
应项目需求需要用到element的上传功能：template： <!-- 上传文件 --> <el-dialog title="导入表格" :visible.sync="uploadFileVisible" width="30%" :append-to-body="true" @close="uploadFileClose" > <div>
2021-03-03 13:50:03
359
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人