- 博客(27)
- 问答 (1)
- 收藏
- 关注
RSS订阅
原创 前端常用工具网站记录
driver.js引导页插件https://bennettfeely.com/clippy/css的clip-path标记，获取标记的路径，而不需自己计算点位置https://picsum.photos/item随机生成图片的网站，页面内直接使用图片路径即可支持指定图片尺寸，随机图片，使用模糊图片，灰白图片等daixu...
2021-01-22 08:57:38
112
原创 element UI使用归纳
在el-menu-item中写触发函数，不是原来的@click而是@click.native。在router-link也是使用@click.native。el-bage绑定hidden，当hidden为true是隐藏，触发的函数实现对hidden的值改变。el-form的refs属性值和this.$refs[refs属性值].validate，一致。el-form-item中的prop是el-form中rule值中的验证规则。点击后el-badge的提示消失。
2023-05-18 17:38:43
526
原创 CSS-归纳
修改滚动条样式// 滚动条样式 传参，传入滑块颜色，轨道颜色// 谷歌浏览器@bgColor: #7ab5dd; // 滑块颜色@trackBgColor: #DFDFDF; // 轨道颜色// EXAMPLE: 使用方法，使用@import引入，在class中写上.useSelfScroll(#999,#eee);即可.useSelfScroll(@blockColor: @bgColor, @trackColor: @trackBgColor) { // 如果加上& .
2022-05-10 15:51:35
152
原创 元素拖拽调整位置
使用drag实现元素拖拽，进行位置调整移动端是不会触发drag事件的<template> <div class="page" id="pageContainer" ref="pageContainer" @drop="drop" @dragover="dragover"> <button id="button1" class="button1" draggable @dragstart="dragstart">点我</button> <
2021-05-12 11:05:09
556
原创 npm常用操作
发布自己的包npm view 包名 versionsnpm version <update_type> patch-补丁，minor-小改，major-大改，查看已发布的版本号npm publish 发布安装sassnpm install node-sass --save-devnpm install sass-loader --save-dev其他·杂查看端口号进程：netstat -aon|findstr “8081”所有情况：netstat -ano.
2021-05-11 14:48:27
305
原创 git常用操作
打标签git tag -a v1.4 -m "my version 1.4"git push origin v1.5修改分支名重命名本地分支，删除远程分支，上传新命名的分支，将远程分支和本地分支进行关联git branch -m oldName newNamegit push --delete origin oldNamegit push origin newNamegit branch --set-upstream-to origin/newName其他·杂git.
2021-05-11 14:38:59
51
原创 动态加载css
css文件加载function addLinkTag (url, fn, fail) { var link = document.createElement('link') link.href = url link.setAttribute('rel', 'stylesheet') link.setAttribute('media', 'all') link.setAttribute('type', 'text/css') link.onload = fn link.onerr
2021-05-10 18:01:24
338
原创 公告移动
左右移动<!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"> <title>Docume
2021-05-10 08:38:00
57
原创 echart地图加载中国地图，可切换省市地图
前提：vue文件（代码并不完整，仅参考）echartMapData是个全局对象，在index.html被引入参考代码<script src="./js/echarts/echartMapData.js"></script>data () { return { // 地图echart对象 echartMap: null, // 地图类型 mapType: 'china', // 地图级别：0-中国地图，1-省份地图
2021-05-04 18:25:55
706
原创 vue项目配置
单位转换：px转vw安装postcss-px-to-viewport配置：在postcss.config.js文件中增加代码，如下参考链接：https://www.npmjs.com/package/postcss-px-to-viewportmodule.exports = { plugins: { autoprefixer: {}, 'postcss-px-to-viewport': { viewportWidth: 750, // 视窗的宽度，对应的是我们设计稿
2021-05-04 18:08:02
120
原创 VSCode配置记录
json文件配置{ "window.zoomLevel": 1, "editor.detectIndentation": false, "editor.tabSize": 2, "editor.quickSuggestions": { "strings": true }, "editor.suggestSelection": "first", "vsintellicode.modify.editor.suggestSelection": "automaticallyOv
2021-05-04 17:55:49
194
原创 转盘绘制-canvas
<template> <div class="pie-wrapper" ref="pieWrapper"> <!-- 抽奖按钮 --> <slot name="start"></slot> <!-- canvas --> <canvas class="pie" :height="diameter * canvasScal" :width="diameter *
2021-05-04 17:15:54
130
原创 微信JS-SDK使用
微信签名接口import wx from 'weixin-js-sdk'import * as WxApi from '@/core/api/WxApi'// 微信签名export async function wxSignature () { let signature = null let url = encodeURIComponent(location.href.split('#')[0]) // 1. 发送签名请求 await WxApi.getSignature(u.
2021-05-04 17:01:21
851
原创 vue中使用animate.css
安装npm install animate.css引用import animated from 'animate.css' Vue.use(animated)使用配合vue的transition使用<transition name="pop-nowin" enter-active-class="animate__animated animate__bounceInDown" leave-active-class="animated bounceOutRight"> <.
2021-04-28 15:10:07
365
原创 前端开发小问题注意
input的placeholder会出现文本位置偏上的情况input 的placeholder会出现文本位置偏上的情况：PC端设置line-height等于height能够对齐，而移动端仍然是偏上，解决方案时是设置cssline-height：normal;
2021-03-08 09:06:42
108
原创 typescript在windows安装
按照教程安装。前提是已将安装npm安装命令npm install -g typescript查看版本号：tsc -v（当时安装命令执行后，是已经安装了，但是查看版本号提示tsc不是命令，原因是我自己node配置的path错了，这个配置没有影响我npm指令的使用，所以安装成功了，但是tsc显示不是命令，很快可能是node配置环境变量不正确）建立ts文件编译ts文件（test.ts...
2019-12-24 16:25:13
1225
原创 Vue相关插件使用记录
列表轮播（类似新闻列表，中奖信息）：https://chenxuan1993.gitee.io/component-document/index_prod#/component/seamless-default自定义滚动条：https://vuescrolljs.yvescoding.org/zh/如果有遮罩层出现，遮罩层设置z-index，否则滚动条会显示遮罩层之上（应该是插件里边设置了层...
2019-12-12 10:02:09
118
原创 video元素层级过高（微信页面开发）
现象说明：在页面中使用video元素，页面是有个活动规则按钮，规则作为弹窗出现，发现video元素在规则页面之上。且修改双方的层级z-index都不起作用（安卓出现该现象，video元素在最上层，iOS显示正常）。video元素在为播放之前，和普通元素一样，z-index是生效的。但是在播放之后，这个元素就改变了，不在是页面的元素，而是被浏览器接管（安卓），和文档不在一层了，所以z-index是...
2019-12-05 16:04:23
1755
3
原创 移动端（微信）页面 不回弹
目前遇到大致分为两种情况1.iOS出现键盘后，页面不回弹，如下代码可解决（适合大部分情况） if (document.activeElement.tagName === 'INPUT' || document.activeElement.tagName === 'TEXTAREA') { return } let result = 'pc'...
2019-12-01 20:03:11
359
原创 前端实现打印（vue为例）
前端实现打印（vue为例）所遇到问题：打印插件打印插件使用vue的一个打印插件，v-print指令在谷歌浏览器使用使用一直没有反应，360浏览器可以启动打印功能。（可能是我自己没有配置好，已在npm安装以及当前页面引用）生成一维码（条形码）也是使用了vue版的一个插件，vue-barcode，渲染出来的是svg形式，条码清晰。缺点：没有找到设置条形码的高度和宽度的选项。另外一个...
2019-11-15 10:33:42
2828
原创 vue中子组件和父组件之间的对象传递
父组件是index.vue，子组件是addressToast.vue父组件传递给子组件父组件代码代码：// 父组件import引入子组件（子组件路径要对）import addressToast from '@/components/addressToast'// 在component中加载组件components: { addressToast }, // 可以在...
2019-07-12 14:26:36
7113
原创 aix中ipsec的使用
aix类似Linux的iptables命令是ipsecstopsrc -s inetdstartsrc -s inetdrefresh -s inetd 重启inetdetc-mail-sendmail
2019-06-11 22:50:46
3013
原创 vue的路由配置，router-link的使用
在vue项目中使用router-link实现路由的跳转。新建vue组件（在项目中建立以vue结尾的文件）我在components文件下新建了home.vue和login.vue两个文件，两个文件中随便写点什么，有区别就行。在index.js（router文件夹下的）配置路由信息import Vue from 'vue'import Router from 'vue-route...
2018-12-31 22:04:45
4094
原创 webstorm创建vue项目
前提：安装好node.js,git,使用npm安装好vue-cli，webpack。如果需要修改项目端口在项目下面：项目名-》config-》index.js,默认端口号是8080。如果出现以下图中的错误：本人用到的解决办法：点击图中的左上角的三角形箭头（run字下面的三角形图标），会出现以下的信息：[email protected] install: node install.js，...
2018-12-26 11:13:15
1030
空空如也
axios和setstate作用域理解
2022-08-01
TA创建的收藏夹 TA关注的收藏夹
TA关注的人