前端
c_reshape
I went from zero
展开
-
Css之El-tree(已设置show-checkbox属性) 第一层节点不显示checkobox勾选框
El-tree 第一层节点不显示checkobox原创 2022-12-21 09:35:37 · 1130 阅读 · 0 评论 -
Why it occurs this error [The JSON value could not be converted to System.Nullable]
The JSON value could not be converted to System.Nullable原创 2022-10-18 15:44:08 · 591 阅读 · 0 评论 -
Vue3之lodash-es debounce使用
防抖和节流原创 2022-10-18 15:36:26 · 7094 阅读 · 1 评论 -
ElementPlus报错: [ElForm] unexpected width NaN
ElementPlusError原创 2022-10-18 14:55:42 · 3476 阅读 · 0 评论 -
Js之回流和重绘
回流和重绘原创 2022-07-13 11:15:32 · 1323 阅读 · 0 评论 -
Js之判断数据类型的通用方法
最新的数据类型:String、Number、Object、Boolean、null、undefined、Symbol、BigInt原创 2022-07-10 19:16:26 · 131 阅读 · 0 评论 -
Js之过滤HTML Collection
dom classList原创 2022-06-06 11:22:19 · 295 阅读 · 0 评论 -
Js之获取iframe中的元素
iframe原创 2022-06-02 14:54:40 · 1454 阅读 · 0 评论 -
Css之设置光标颜色
示例:input { border: none; background-color: transparent; caret-color: #fff; // 设置光标颜色}.input-select { width: 7.2rem; caret-color: #fff; // 设置光标颜色 :deep(.ant-select-selection-search-input) { color: #fff; }}...原创 2022-05-31 10:40:28 · 1011 阅读 · 0 评论 -
Js之echarts图片下载
1、使用canvas的toDataURL方法const canvas = document.getElementsByTagName('canvas');const dom = Array.from(canvas)[6];const baseUrl = dom.toDataURL('image/png'); // 获取base64const link = document.createElement('a');link.href = baseUrl;link.setAttribute('do原创 2021-12-17 17:25:15 · 867 阅读 · 0 评论 -
Css之字体渐变 (包括iconfont font class)
.iconfont { background: linear-gradient(-45deg, #0096ff, #00dcd2); // iconfont图标渐变 background-clip: text; font-size: 0.41rem; -webkit-text-fill-color: transparent;}.title { display: flex; flex-direction: column; margin-top: 0.48rem;.原创 2021-10-27 17:43:58 · 379 阅读 · 0 评论 -
Css之推荐自动排序插件CSScomb(css排序)
vscode配置1、安装CSScomb插件。2、settings.json中,增加以下配置{ "csscomb.formatOnSave": true, "csscomb.preset" : "yandex", // 官方推荐选项csscomb, zen, yandex}参考文章:推荐css自动排序插件csscomb - 简书原创 2021-09-23 14:12:21 · 1149 阅读 · 0 评论 -
Attach Authorization header for all axios requests (为所有 axios 请求附加授权头)
axios.interceptors.request.use((config) => { // Set the AUTH token for any request const token = window.localStorage.getItem('token'); if (token) { config.headers.Authorization = token; } return config;});参考链接:https://stackoverflow.com.原创 2021-08-05 17:18:10 · 85 阅读 · 0 评论 -
Js之 || 和 &&, == 和 ===
它们的返回值是两个操作数中的一个(且仅一个)。即选择两个操作数中的一个,然后返回它的值。之所以说大致相当,是因为它们返回结果虽然相同但是却有一个细微的差别。在 a ? a : b 中,如果 a 是一个复杂一些的表达式(比如有副作用的函数调用等),它有可能被执行两次(如果第一次结果为真)。而在 a || b 中 a 只执行一次,其结果用于条件判断 和返回结果(如果适用的话)。...原创 2021-08-05 15:39:05 · 446 阅读 · 0 评论 -
Js之分析模仿类
概述:JavaScript 中只有对象。面向类的语言:类可以被复制(或者说实例化)多次,就像用模具制作东西一样。实例化(或者继承)一个类意味着“把类的行为复制到物理对象中”,对于每一个新实例来说都会重复这个过程。Js:没有类似的复制机制。 不能创建一个类的多个实例,只能创建多个对象。它们[[Prototype]]关联的是同一个对象。 这些对象之间并不会完全失去联系,它们是互相关联的。 例如: function Per...原创 2021-08-01 08:27:21 · 102 阅读 · 0 评论 -
Js之async await和promise写法
写法一:async function asyncFunc() { await this.getFeatureInfoByPoint(0); attribute.isFirstData = this.featureInfo.isFirstData; attribute.isLastData = this.featureInfo.isLastData; this.updataFeatureInfo(attribute);}asyncFunc.apply(this); // 或者asyn原创 2021-07-28 17:24:47 · 162 阅读 · 0 评论 -
Js之bind,apply,call三者的区别
apply()方法调用一个具有给定this值的函数,以及以一个数组(或类数组对象)的形式提供的参数。(使用 apply 方法改变this指向后原函数会立即执行,且此方法只是临时改变this指向一次。)call()方法使用一个指定的this值和单独给出的一个或多个参数来调用一个函数。(使用 call 方法改变this指向后原函数会立即执行,且此方法只是临时改变this指向一次。)bind()方法创建一个新的函数,在bind()被调用时,这个新函数的this被指定为bin...原创 2021-07-28 15:55:12 · 540 阅读 · 0 评论 -
Js之链式调用
链式调用的核心,就是函数在执行完成后,返回了this,即当前对象。/* * @Author: shape * @Date: 2021-07-26 14:03:45 * @LastEditors: shape * @LastEditTime: 2021-07-26 14:51:15 * @Description: 链式调用类 * @FilePath: \ht-vue-frame\src\utils\chain.js */class Person { constructor(prop原创 2021-07-26 15:54:13 · 368 阅读 · 0 评论 -
Js之reduce()用法
reduce()方法对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值。语法:arr.reduce(callback, [initialValue])即:arr.reduce((previousValue, currentValue, index, arr), [initialValue])callback (执行数组中每个值的函数,包含四个参数) 1、previousValue (上一次调用回调返回的值,或者是提供的初始值in.原创 2021-07-20 14:27:03 · 139 阅读 · 0 评论 -
HTML5本地储存--实时监听storage事件, 单窗口多页面只能允许一个用户登录
mounted() { // 测试单浏览器窗口多个页面登录的demo if (!this.watchMultipleUsersFn) { this.watchMultipleUsersFn = (e) => { const { key } = e; if (key === 'userInfo') { location.reload(); // 同window.location.reload(); } .原创 2021-07-19 13:48:29 · 269 阅读 · 0 评论 -
Js之IIFE(立即调用函数表达式)
IIFE( 立即调用函数表达式)是一个在定义时就会立即执行的JavaScript函数。(function () { statements})();这是一个被称为自执行匿名函数的设计模式,主要包含两部分。第一部分是包围在圆括号运算符()里的一个匿名函数,这个匿名函数拥有独立的词法作用域。这不仅避免了外界访问此 IIFE 中的变量,而且又不会污染全局作用域。第二部分再一次使用()创建了一个立即执行函数表达式,JavaScript 引擎到此将直接执行函数。示例当...原创 2021-07-07 17:44:31 · 231 阅读 · 0 评论 -
Js之JSON.parse() and JSON.stringify()
JSON.parse() :a JSON string to a JavaScript object.JSON.stringify() :a JavaScript object to a JSON string.应用于对象的例子:const myObj = { name: 'Skip', age: 2, favoriteFood: 'Steak'};const myObjStr = JSON.stringify(myObj);console.log(myObjStr)..原创 2021-07-06 17:44:19 · 154 阅读 · 0 评论 -
ECharts之How to use the resize event of the window?
do notusewindow.addEventListener('resize', () => myEcharts.resize();)do like this:const myEcharts = echarts.init(document.getElementById('radar_container'));myEcharts.setOption(this.options);window.onresize(() => { myEcharts.resize();}...原创 2021-07-05 16:20:22 · 54 阅读 · 0 评论 -
Format json data and output to html
<pre id="json"></pre>jsonData: { Intent: { Command: 'search', SubIntent: null, },},mounted() { document.getElementById('json').innerHTML = JSON.stringify(this.jsonData, undefined, 2);},参考:https://stackoverflow.com/questi.原创 2021-06-30 13:52:54 · 64 阅读 · 0 评论 -
Css之iconfont填色
<a slot="operator" class="table-operator"> <i class="iconfont icon-zuoyou01" /> <i class="iconfont icon-rizhiguanli" /></a>.table-operator { .iconfont { font-size: 0.18rem; &.icon-zuoyou01 { margin-righ.原创 2021-06-15 10:06:03 · 984 阅读 · 0 评论 -
Js之正则表达式请使用字母、数字和特殊符号组合,8-20个字符
参考:https://stackoverflow.com/questions/19605150/regex-for-password-must-contain-at-least-eight-characters-at-least-one-number-a实际:At least 8 characters long; At most 20characters long; One lowercase / one uppercase, one number and one special ch.原创 2021-06-09 17:20:41 · 2596 阅读 · 0 评论 -
Js之Check if a string has white space
1、 use theindexOfmethod on the input string:function hasWhiteSpace(string) { return string.indexOf(' ') >= 0;}2、use the test method, on a simple RegEx:function hasWhiteSpace(string) { return /\s/g.test(string);}原创 2021-06-09 16:56:24 · 107 阅读 · 0 评论 -
how to reload a page using JavaScript (重载vuex)
window.location.reload();You can perform this task usingwindow.location.reload();. As there are many ways to do this but I think it is the appropriate way to reload the same document with JavaScript. Here is the explanationJavaScriptwindow.location...原创 2021-06-08 17:32:43 · 135 阅读 · 1 评论 -
Echarts之如何去掉title/legend/toolbox等组件所占的空间?
https://github.com/apache/echarts/issues/247解决方法: 设置grid原创 2021-06-03 17:16:12 · 2002 阅读 · 1 评论 -
Js之将“false”转换为false
JSON.parse('false') // falseJSON.parse('true') // true原创 2021-05-21 10:28:23 · 1116 阅读 · 0 评论 -
Web API 接口参考 Element Element.scrollTop和scrollLeft
Element.scrollTop属性可以获取或设置一个元素的内容垂直滚动的像素数。一个元素的scrollTop值是这个元素的内容顶部(卷起来的)到它的视口可见内容(的顶部)的距离的度量。当一个元素的内容没有产生垂直方向的滚动条,那么它的scrollTop值为0。示例代码:this.$nextTick(() => { const [middleDom] = document.getElementsByClassName('middle-bottom'); middleD...原创 2021-05-19 11:50:47 · 795 阅读 · 0 评论 -
require,import区别
https://www.zhihu.com/question/56820346原创 2021-05-14 15:35:55 · 54 阅读 · 0 评论 -
Echarts之toolbox saveAsImage icon的样式
<script>const echartsDown = require('@/static/images/icon_download.png');const singleBasicOptions = { color: ['#1559BD'], toolbox: [ { show: true, orient: 'vertical', right: 20, top: 20, feature: { sa.原创 2021-05-14 15:16:46 · 1730 阅读 · 0 评论 -
Css之选择器
一、基本选择器 1、标签选择器,例如span { width: auto;} 2、类选择器,例如<div class="container">容器</div>.container { width: 2rem; height: 2rem; background: #989898;} 3、id选择器,例如<div id="container">容器</div>#containe...原创 2021-04-27 22:37:24 · 126 阅读 · 0 评论 -
Echarts之外部点击触发echarts的保存图片功能
<template> <section> <section id="myEcharts"></section> <a-button @click="onClick">点击</a-button> </section></template><script>import echarts from 'echarts';import { exportImg } from '@.原创 2021-04-09 14:45:45 · 1561 阅读 · 0 评论 -
Css之scoped (有作用域的 CSS)
当<style>标签有scoped属性时,它的 CSS 只作用于当前组件中的元素。这类似于 Shadow DOM 中的样式封装。它有一些注意事项,但不需要任何 polyfill。它通过使用 PostCSS 来实现以下转换:<template> <div class="example">hi</div></template><style scoped>.example { color: red;}<...原创 2021-03-29 10:35:51 · 6765 阅读 · 0 评论 -
JS之怎么判断对象属性值是undefined / 空
if (Object.values(obj).some((i) => i === undefined)) { this.$message.error('存在undefined!'); return;}if (Object.values(obj).some((i) => i === '')) { this.$message.error('存在空值!'); return;}原创 2021-03-03 16:33:48 · 2432 阅读 · 2 评论 -
Css /deep/ 用法
<style scoped lang="scss">/deep/ .ant-table-placeholder { border-bottom: none;}</style>1、/deep/选择器是chrome浏览器自己的标准,其他浏览器并没有实现这个标准,所以其他浏览器是失效的。2、deep/的意思为深入的,深远的。无意中看到css中有关于这种写法,开始没太注意 ,以为是组件css的写法,后来才发现不是。我们都知道Scoped CSS规范是Web组件产生不污.原创 2021-03-02 14:18:04 · 690 阅读 · 0 评论 -
Js之for循环splice()方法删除数组中的元素会被跳过或者只能删除部分
错误原因:每次array.length都会变化减小,但是i的没次都会增加,等到删到一半的时候,i的值已经增加到和length一样的长度了,导致不会在循环,前面的值就没有删掉了。想要的效果是循环遍历数组把空的删掉正确代码:/** * @author: shapec * @description: 剔除对象数组中的空对象 * @param {*} filterEmptyObj * @return {*} */export const filterEmptyObj = (arr) =&g原创 2021-02-02 09:50:42 · 896 阅读 · 0 评论 -
Js之去掉字符串最后几位
示例:str.substring(0, str.length - 6);原创 2021-01-21 11:37:11 · 8486 阅读 · 2 评论