- 博客(46)
- 收藏
- 关注
RSS订阅原创 vue3+element Plus中使用日期格式化库day.js
Element-plus (opens new window)组件库默认支持 dayjs 进行日期时间处理，所以可以直接导入使用，相关 Date Picker (opens new window)组件介绍。
2023-11-21 15:52:11
1779
原创 vue element UI el-cascader 级联选择器 获取当前选择值的整个对象
要使用到cascader组件选中的数据的所有部分，并没有类似于select组件中的value可以指定，查看官方文档提供了新的方法，官方地址https://element.eleme.cn/#/zh-CN/component/cascader。
2022-09-21 16:29:17
9807
1
原创 解决一次window下装包错误， “Can‘t find Python executable “python“, you can set the PYTHON env variable.“
在window系统上使用npm install 报错信息如下1、安装cnpm，并添加镜像npm install -g cnpm --registry=https://registry.npm.taobao.org2、使用cnpm安装cnpm install3、运行npm run serve
2022-03-30 19:27:27
1625
原创 vue3 使用vue cli创建一个vue3项目教程指南
第一步1 、使用vue --version 查看是否安装vue如果没有安装，使用命令：npm install vue-cli -g 安装，安装成功之后会显示版本号2 、创建项目：使用命令 vue create nfinite_rolling创建项目
2022-03-16 14:29:29
1370
原创 vue ts上传大图片，转换为base64
// html部分<input type="file" class="shadow-input" multiple="multiple" οndragenter="return false" @change="fileChangeHandler" ref="file" /> //js部分 fileChangeHandler(event: any) { let _files = event
2021-11-26 10:29:41
882
原创 js 正则匹配两个字符串中间的字符，一级匹配带有反斜杠的字符串
正则匹配两个字符串中间的字符使用正则表达式去匹配，这里是匹配’allowed=v’与’l’之间的字符串let str = "lorem ballaalal,allowed=valuelalala"str = str.match(/allowed=v(\S*)l/); console.log('====>',str)输出结果为：带有反斜杠的字符带有反斜杠的字符串需要先转义，在字符串中，反斜杠用作转义字符，你如果要输出’’，实际上要输入’’，第一个表示转义，第二个是实际输出。使用正则表
2021-11-17 18:35:14
6540
原创 canvas实现前端图片下载
问题描述：前端下载图片可以使用一下两种方式1、通过a标签直接打开，同域名下可以直接下载，不同域名下会打开新的标签页。项目中图片往往都是单独存储，很多不在同一个域名下。就用到下面第二种方式2、通过canvas标签下载，代码如下：//data为图片URL downloadClickHandler(data:any){ if (!data) { return; } this.getUrlBase64(data).then((base
2021-11-17 14:54:38
875
原创 css3 calc函数不生效问题
cacl不生效有两种可能性使用’+’,’-‘时，’+’,’-‘前后必须要用空格，’*’,’/'不需要加空格//错误用法width: calc(100vh+154px);//正确用法 width: calc(100vh + 154px);在less中使用需要添加’‘~’，例如： width: calc(~'100vh + 154px');...
2021-11-10 20:02:56
739
原创 厘米如何转换成像素
厘米是长度单位，1厘米等于10毫米。像素是指由图像的小方格组成的，这些小方块都有一个明确的位置和被分配的色彩数值，小方格颜色和位置就决定该图像所呈现出来的样子。 可以将像素视为整个图像中不可分割的单位或者是元素。不可分割的意思是它不能够再切割成更小单位抑或是元素，它是以一个单一颜色的小格存在 。每一个点阵图像包含了一定量的像素，这些像素决定图像在屏幕上所呈现的大小。所以厘米和像素之间无法直接转换。只有在分辨率（dpi）下才能进行转换计算公式：(厘米*dpi)/25.4...
2021-11-09 11:37:21
7828
原创 vue2使用ts深度监听对象属性
首先引入Watchimport { Component, Vue, Prop,Watch } from 'vue-property-decorator';代码如下@Watch("templateEditForm.type", { immediate: true, deep: true }) onTypeChange(newVal:any, oldVal:any) { console.log(newVal + ',' + oldVal); }
2021-11-09 11:33:17
715
原创 element-ui中的el-tree组件自定义slot使用
element-ui中的el-tree组件自定义slot使用<el-tree ref="tree" class="tree" v-show="!value" highlight-current :accordion="false" node-key="id" :data="[queryTree]" :props="defaultProps" :expand-on-click-node="false"
2021-09-14 16:45:39
3244
原创 elementUI el-time-picker重新赋值之后，再选择日期不更新问题
拿到编辑数据赋值给time-picker的v-modelasync handleEdit(index, row) { this.editType = row.itemType const data = await fetchDomainItemQueryById ({clusterId: this.treeNode.id,itemType: row.itemType,itemId: row.itemId}) this.form = data.data
2021-09-14 16:06:17
1456
原创 浏览器输入网址并打开的整个过程
一、 输入导航栏输入网址（jd.com）二、域名解析域名解析就是有域名到ip地址的过程，一般分为以下几步：浏览器缓存，浏览器会缓存DNS（Domain Name System，域名系统）一段时间系统缓存，从本机host中查找是否有对应的域名及ip路由器也会缓存域名信息ISP(baiInternet Service Provider，即因特网服务提供商) DNS缓存，到互联网服务提供商的DNS里查找缓存，ISP的DNS缓存时间一般是1个小时。前后2次间隔1个小时的话，他就去域名的DNS上重新取得
2020-11-12 18:20:03
4427
2
原创 GIT代码仓库管理规范
为什么要做代码管理规范？讲个小故事，王者荣耀或者英雄联盟都玩过吧。我们要gank(游戏中一个或几个的游戏角色行动，对对方的游戏角色进行偷袭、包抄、围杀)对面中单选手，于是约定策略为我方中单负责勾引，牵扯住对方中单我方打野埋伏在草丛，等待辅助过来辅助选手从下路赶过来支援如果各位选手按照策略进行会对敌方进行一波很好的击杀，但由于打野沉不住性子，在埋伏的过程中，去了对方野区反了波野怪被看到了位置。对面选手来了波反蹲，我方其它选手并不知情，毅然选择开战，结果可想而知被地方反杀。代码管理也是一个多人合
2020-11-03 16:10:57
1424
原创 基于react+and Design实现下拉框，支持自由输入，hooks篇
基于基于react+and Design实现自由输入，hooks篇，主要使用到AutoComplete组件import React, { useEffect, useState } from 'react';import styles from './index.less';import 'antd/dist/antd.css';import { AutoComplete } from 'antd';const { Option } = AutoComplete;export default.
2020-09-02 17:55:18
1223
原创 做一道算法题，1. 两数之和
摘自leecode，链接: https://leetcode-cn.com/problems/two-sum/.给定一个整数数组 nums 和一个目标值 target，请你在该数组中找出和为目标值的那 两个 整数，并返回他们的数组下标。你可以假设每种输入只会对应一个答案。但是，数组中同一个元素不能使用两遍。示例:给定 nums = [2, 7, 11, 15], target = 9因为 nums[0] + nums[1] = 2 + 7 = 9所以返回 [0, 1]来源：力扣（LeetCod
2020-06-20 16:22:05
171
原创 教大人写前端第二课之《新手入门了解CSS样式表》
看这篇之前，你应该具备一点点html的知识了。也可移步《html常用标签学习》链接: https://blog.csdn.net/qq_37617413/article/details/106459876.一、什么是css？1. 释义CSS 指层叠样式表 (Cascading Style Sheets)，定义如何显示 HTML 元素样式，样式通常存储在样式表中。2. 作用要使用CSS对HTML页面中的元素实现一对一，一对多或者多对一的控制，这就需要用到CSS选择器。例如，修改字体、大小、颜色、间距
2020-06-08 11:28:55
218
原创 React Ant Design Form Cascader 组件回显问题
先看一下Cascader组件但是使用回显时的例子import React from 'react';import ReactDOM from 'react-dom';import 'antd/dist/antd.css';import './index.css';import { Cascader } from 'antd';const options = [ { value: 'zhejiang', label: 'Zhejiang', children: [
2020-06-05 16:50:18
7577
原创 教大人写前端第一课之《新手入门html常用标签学习》
新手入门第一课之html常用标签学习一 、 什么是HTML？二、常用标签三、标签的分类**1 块级元素****2 行内元素，又称内联元素****3 行内块元素**一 、 什么是HTML？HTML称为超文本标记语言，是一种标识性的语言。它包括一系列标签．通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字，图形、动画、声音、表格、链接等。二、常用标签1 使用频率较高<html><
2020-05-31 21:05:23
458
1
原创 基于react antDesign 封装一个校验图片尺寸与大小的图片上传组件
本文主要是基于react antDesign UpLoad组件，封装一个可以校验尺寸、大小的图片上传组件。Ant Design官方文档已经给出了校验图片大小的demo，代码如下。function beforeUpload(file) { const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png'; if (!isJpgOrPng) { message.error('You can only uplo
2020-05-25 18:45:07
1292
原创 基于react antDesign 封装一个简单的Select组件
基于react antDesign 封装一个简单的search组件，可移步官网: 查看.目的在基于Select功能的基础上封装为圆角、改变下拉箭头颜色Select组件，这里命名为jrSelect废话不多说啦，先看下Ant Design 给出的效果图：目标实现效果图：jsx部分实现1 定义一个名为JrSelect的组件，export default JrSelect导出组件1 className={`${className} round_select`} 接收父组件className拼接到子
2020-05-21 21:46:54
2700
3
原创 React TypeScript 报错 Readonly 不存在属性"字段名"
React TypeScript 报错类型"Readonly<{}>“上不存在属性"字段名”react项目中ts报错代码如下：onAddTabBar = () => { let _panes = this.state.panes.concat([{ title: `Tab ${this.state.panes.length + 1}`, content: 'Content of Tab 2', key: this.state.panes.length + 1 }]) t
2020-05-10 14:56:36
3275
原创 React 针对 ant Design select 组件进行二次封装
React 针对 ant Design 库 select 组件进行二次封装由于业务需要对select进行样式上的修改，部分select还需要使用原样式。这种情况可以通过两种方式来实现：1 通过className进行样式覆盖2 通过二次封装组件，相对于仅修改css样式来说更加的灵活本次介绍第二种方式对组件进行二次封装/** @Date 2020/5/8* @Author zuolinya* @Description antd select组件 二次封装* 1 设置为圆角*/import
2020-05-08 20:36:29
2035
原创 网页里面 音/视频 加载同步阻塞问题分析以及优化
在开发中，经常会有加载网页完成之后会走加载完成的回调，我们在这个回调里面做一些事情，由于网页是顺序同步加载，这个回调会很慢。测试demo： <script> console.time('start') </script> <div> <audio src="../demoMusic1.mp3"></audio> &l...
2020-04-23 10:43:38
712
原创 （一）初识JavaScript——无处不在的JavaScript，js基础
一 、“理解”JavaScript语言人们总觉得对 C# 或者 Java 的了解，能为他们理解 JavaScript 的工作原理打下坚实的基础，然而这时一个陷阱。与其他语言相比 JavaScript 的函数式语言的血统更多一些。 JavaScript 中的一些概念从根本上不同于其它的语言。这些根本性的差异包括以下内容：函数是一等公民（一级对象）——在 JavaScript 中函数与对象共...
2020-04-21 17:26:22
438
原创 css盒子模型，注图，源码详解
什么是盒子模型CSS 盒子模型（Box Modle）可以用来对元素进行布局，包括内边距（padding），边框（border），外边距（margin），和实际内容（content）这几个部分。Margin(外边距) - 清除边框外的区域，外边距是透明的。Border(边框) - 围绕在内边距和内容外的边框。Padding(内边距) - 清除内容周围的区域，内边距是透明的。Content(...
2020-03-30 16:37:16
452
原创 受疫情影响，可以看的几步电影
看完韩国的电影，庆幸自己生活在中国，生活在一方有难八方支援的中国，生活在万众一心的中国1 流感（韩国）揭露了人性的丑恶，恐怖镜头多，中间穿插了情感了2 传染病（美国）真是性比流感强，更贴近无现实，更像是一部纪录片3 寄生虫（韩国）医院为了卖药，故意把变异的了寄生虫放进水里，个别画面恐怖，更像是丧失片持续更新中…1 流感（韩国）揭露了人性的丑恶，恐怖镜头多，中间穿插了情感了2 传染病（美国）...
2020-02-11 11:04:12
552
原创 js 正则之反向引用小结-详解
正则表达式 /(?:ninja)-(trick)?-\1/ 能匹配到以下哪个字符串？a . ‘ninja-’b. ‘ninja-trick-ninja’c. ‘ninja-trick-trick’
2020-01-13 22:20:16
242
原创 微信小程序报错error:project.config.json未找到pluginRoot字段
上传测试环境代码，提示以下内容解决方案，把插件模式改为小程序模式
2019-09-19 17:28:11
4020
4
原创 vue tab切换echars宽度不对，显示100px问题
vue tab切换echars宽度不对，显示100px问题使用vue的el-tab-pane组件，切换到第二个组件的时候，底下的echars图宽度显示为100px第一步：获取外层元素的宽度，赋值给echars第二步：切换到第二个tab栏的时候，重绘图表，使用vue的el-tab-pane组件，切换到第二个组件的时候，底下的echars图宽度显示为100px网上搜的乱七八糟的onsize什么的没...
2019-09-10 18:42:31
620
原创 elementUI el-upload自定义参数
elementUI el-upload 上传文件 自定义参数elementUI 提供的Upload 没有自定义回调参数可以通过以下两种方式实现方法一： data传参，官网提供的data方式方法二：很多场景下，页面使用到多个el-upload组件，这个时候element并没有提供类似this的这么个东西，钩子函数的回调里面定位不到当前组件，可以通过以下两种方式获取到当前组件。elementUI...
2019-07-03 18:37:42
40286
1
原创 前端面试题（二）vue和react的区别
相同点1 都支持服务器端渲染2 都有Virtual DOM（虚拟dom）,组件化开发,都有’props’的概念，这是properties的简写。props在组件中是一个特殊的属性，允许父组件往子组件传送数据,都实现webComponent规范3 数据驱动视图4 都有支持native的方案,React的React native,Vue的weex5 构建工具React和Vue都有自己的构...
2019-05-29 13:20:09
7698
原创 前端面试题（一） promise和async/await区别
promise和async/await都是处理异步请求promise的用法基本语法：promise共有三个状态链式调用错误捕获async、await用法错误捕获区别：拓展：js中同步、异步js的同步和异步问题通常是指ajax的回调，如果是同步调用，程序在发出ajax调用后就会暂停，直到远程服务器产生回应后才会继续运行。而如果是异步调用，程序发出ajax调用后不会暂停，而是立即执行后面的代码，服...
2019-05-28 13:38:01
36164
6
原创 小程序button样式重写
小程序button样式重写方法一buttonborder:none;}方法二 如果form标签里的buttonbutton::after{border:none;}如有问题请我~
2019-04-22 11:17:35
938
原创 git commit 关闭eslint校验
vue项目中带eslint校验，在提交代码时遇到报错。虽然这样写起来项目很规范，有时候觉得很烦。需要关闭git提交时校验在项目里面新建.eslintignore文件，在里面忽略就行，例如忽略src文件项目目录：忽略代码：这样就能重新提交代码啦！如有问题请及时联系~...
2018-12-29 15:52:34
25848
2
原创 vue axios前端配合后端解决跨域问题，并将请求放在body中
axios跨域前端修改携带cookie 在axios创建时要加入withCredentials: true，默认withCredentials：false，是不会携带cookie的跨域需要携带两个参数config.data = JSON.stringify(config.data)； config.headers = {Content-Type':'application/json' }。需要后端...
2018-12-28 18:25:52
5041
原创 angularJS1 引入静态js变量
angularJS1 引入静态js变量引入定义全局变量在angular.module('myApp').controller引用引入<script src="${ctx}/map/js/first_cate_brand_json.js"></script>定义全局变量var brand = [{"code": "100005", "name": "艺银格
2018-12-21 17:46:56
892
原创 vue cli 在mac中配置
vue cli 在mac中配置全局安装 npm install -g vue-cli使用vue list查看vue的模板初始化启动项目全局安装 npm install -g vue-clinpm install -g vue-cli使用vue list查看vue的模板vue list初始化启动项目使用webpack 模板生成一个vue的项目vue init webpack v...
2018-12-19 19:27:10
653
原创 javascript中string与number相加得到字符串，相减却是数字
原理javascript是一门弱类型语言。弱类型语言 是相对强类型语言来说的，在强类型语言中，变量类型有多种，例如int char float boolean 等，不同的类型相互转换有时需要强制转换。javascript只有一种类型var ，为变量赋值时会自动判断类型并进行转换，所以javascript是弱语言。在别的编程语言中，会对变量的类型有严格的限制，之间的转换也有规定。开始定义一个...
2018-12-13 14:50:51
6224
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人