Demo
关注
分享
扫一扫
zoepriselife316
这个作者很懒，什么都没留下…
展开
-
js时间戳转化
时间戳转换原创 2022-04-18 15:30:56 · 540 阅读 · 0 评论 -
简易的防抖节流
防抖：如果短时间内大量触发同一事件，只会执行一次函数。节流：一种类似控制阀门一样定期开放的函数，也就是让函数执行一次后，在某个时间段内暂时失效，过了这段时间后再重新激活（类似于技能冷却时间）。// 防抖function debounce(fn, delay) { let timer = null return function () { if (timer) clearTimeout(timer) timer = setTimeout(fn, delay原创 2021-04-27 16:39:45 · 150 阅读 · 0 评论 -
力扣题-1. 两数之和
两数之和给定一个整数数组 nums 和一个整数目标值 target，请你在该数组中找出 和为目标值 的那 两个 整数，并返回它们的数组下标。你可以假设每种输入只会对应一个答案。但是，数组中同一个元素不能使用两遍。你可以按任意顺序返回答案。示例 1：输入：nums = [2,7,11,15], target = 9输出：[0,1]解释：因为 nums[0] + nums[1] == 9 ，返回 [0, 1] 。示例 2：输入：nums = [3,2,4], target = 6输出：[.原创 2021-03-15 17:04:58 · 91 阅读 · 0 评论 -
记录下JS中map的使用
声明：let map = new Map()设置值：map.set("key","value");取值：map.get("key")判断是否存在key值：map.has("key")删除：map.delete("key")原创 2021-03-15 15:47:04 · 127 阅读 · 0 评论 -
vuex存储的东西刷新会消失，使用sessionStorage可解决
使用场景，用户进入页面，输入一些信息，如姓名电话。当刷新或返回上一页，内容会清空，使用vuex，返回上一页会显示，刷新则不行，会清空。所以使用了sessionStorage.，会话关闭就删除内存，也可根据需求删掉内存。在vue中使用，具体使用如下：<el-form class="demo-ruleForm" :model="form" ref="form" :rules="rules"> <el-form-item prop="name">原创 2021-01-29 16:11:38 · 695 阅读 · 0 评论 -
js获取地址中的参数方法
直接写方法：function get(queryName) { var query = decodeURI(window.location.search.substring(1)); var vars = query.split("&"); for (var i = 0; i < vars.length; i++) { var pair = vars[i].split("="); if (pair[0] == queryName)原创 2021-01-19 18:00:56 · 211 阅读 · 0 评论 -
js生成唯一的值
// 随机数 mathNum() { return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1); },一直执行就可以获得不同的随机唯一值原创 2021-01-15 18:17:35 · 1604 阅读 · 0 评论 -
js事件执行顺序小例子
直接上代码，保存为js，node 该代码，命令行即可看执行结果//整体script作为一个宏任务。console.log('1'); //直接执行 1// 整体script作为宏任务，结束后，进入到这个宏任务中，//放到宏任务1 event QueuesetTimeout(function () { console.log('2'); //会先输出2 process.nextTick(function () { // 放入微任务Queue1下的--记为Q1-then原创 2021-01-08 15:32:13 · 167 阅读 · 0 评论 -
给tab加下划线表示选中，scss写的，css改造下即可
上代码：html:<div class="btn-view"> <button type="text" :class="index === i ? 'btn-active' : ''" v-for="(item, i) in btns" :key="i" @click="tabsClick(item, i)" > {{ item }} </b.原创 2020-12-28 16:06:21 · 791 阅读 · 0 评论 -
table表格简单使用
table表格w3c地址：https://www.w3school.com.cn/tags/tag_table.asp<div id="test"> <table border="1" align="center" cellspacing="0" cellpadding="10"> <caption>我是表头</caption> <thead> <th>我是头<原创 2020-12-17 15:00:04 · 236 阅读 · 0 评论 -
vue组件中是否可以访问实例data中数据？
上代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>组件中是否可以访问实例data中数据？不可以！</title> <script src="htt原创 2020-12-01 18:02:18 · 955 阅读 · 0 评论 -
vue遍历数组的demo
li 有相同的样式，现在想点击某一项的时候，可以颜色变成红色，表示选中的某一项。用到v-for，还有一个中间变量，进行对比代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>原创 2020-10-28 15:38:10 · 404 阅读 · 0 评论 -
js数组方法
数组的方法：let a = ['a','b','c','d'];console.log(a.pop()) //d 返回删除的元素（a的最后一个元素）console.log(a) // ["a", "b", "c"]console.log(a.push('y')) //4 返回长度 在a的最后一个元素位置添加console.log(a.unshift('p')); // 5 返回长度，在a的第一个元素前添加console.log(a) //["p", "a", "b", "c",原创 2020-10-28 14:41:17 · 170 阅读 · 0 评论 -
v-for中的:key使用
代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>登录切换和key属性的简单介绍</title> <script src="https://cdn.原创 2020-10-15 17:15:50 · 308 阅读 · 0 评论 -
v-for遍历数组和对象
直接放代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>vue遍历-v-for</title> <script src="https://cdn.js原创 2020-10-15 16:21:19 · 435 阅读 · 0 评论 -
vue中v-show和v-if的对比
结论： 开发中，v-if和v-show选用哪个：若元素切换频率过高时，使用v-show，若只有一次切换的时候，选用v-if若判断的条件为后台返回数据，大部分使用v-if直接上代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scal原创 2020-10-15 15:28:59 · 158 阅读 · 0 评论 -
切换登录例子及问题
直接上代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>登录切换</title> <script src="https://cdn.jsdelivr原创 2020-10-15 15:16:07 · 133 阅读 · 0 评论 -
vue条件指令
条件指令：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>vue条件指令</title> <script src="https://cdn.jsdeli原创 2020-10-15 14:43:00 · 294 阅读 · 0 评论 -
v-on事件绑定及事件修饰符
直接上代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>v-on事件绑定</title> <script src="https://cdn.jsde原创 2020-09-30 17:39:18 · 311 阅读 · 0 评论 -
ES6中的增强写法
有属性和函数的增强写法两种。上代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>增强写法</title></head><body>原创 2020-09-30 15:03:40 · 580 阅读 · 0 评论 -
var和let、const的分别使用
直接上代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>作用域-var与let的区别</title></head><body>原创 2020-09-30 13:46:28 · 121 阅读 · 0 评论 -
计算属性的复杂使用
复杂一点的计算属性操作：<template> <div id="computedBox"> <!-- 使用拼接的方法，可读性不佳，多个的话写起来繁琐 --> <h2>{{firstName + ' ' + lastName}}</h2> <h2>{{firstName}} {{lastName}}</h2> <!-- 可以调用方法显示，不过不够简洁 -->原创 2020-09-27 15:29:18 · 202 阅读 · 0 评论 -
computed计算属性使用
计算属性：代码：<template> <div id="computedBox"> <!-- 使用拼接的方法，可读性不佳，多个的话写起来繁琐 --> <h2>{{firstName + ' ' + lastName}}</h2> <h2>{{firstName}} {{lastName}}</h2> <!-- 可以调用方法显示，不过不够简洁 -->原创 2020-09-25 17:02:50 · 211 阅读 · 0 评论 -
v-bind:style
v-bind:style的使用：代码：<template> <div id="eg"> <p>v-bind绑定style:封装组件时， 公共组件可以绑定值，使用的人根据自己要用的颜色样式，传值。 来达到不同的效果。</p> <!-- <h2 :style="key(属性值，如font-size):value(属性值，如40px)">{{msg}}</h2> -原创 2020-09-25 16:35:21 · 406 阅读 · 0 评论 -
v-bind绑定使用（绑定class）
测试代码：<template> <div class="hello"> <h3>v-bind使用</h3> <p>一般的显示</p> <a href="http://www.baidu.com">去百度</a> <img src="https://img-blog.csdnimg.cn/images/-402845201200901125411855.png原创 2020-09-25 15:46:20 · 335 阅读 · 0 评论 -
使用Fiddler
下载Fiddler地址：https://telerik-fiddler.s3.amazonaws.com/fiddler/FiddlerSetup.exe下载完，配置一下，本地的地址及端口号去手机上，下载证书使用手机浏览器访问http://【电脑IP地址】:【fiddler设置的端口号】，既可以下载fiddler的证书并安装【查看电脑IP的方法，直接在cmd下ipconfig，或者鼠标滑过fiddler的online也可以看到IP地址】我的是荣耀x10，在浏览器中输入域名及端口号，就可以有下载原创 2020-09-04 10:30:33 · 177 阅读 · 0 评论 -
节流函数
来个简单的节流函数//节流throttle代码： throttle(fn, time) { let _arguments = arguments; let canRun = true; return function () { if (!canRun) return; canRun = false; setTimeout(() => { fn.call(this, _arguments);原创 2020-09-03 15:31:13 · 204 阅读 · 0 评论 -
根据用户电脑系统不同配置不同下载地址
有个需求，根据系统不同，下载地址也不同，上代码：//判断系统类型 witchSystem() { var agent = navigator.userAgent.toLowerCase(); var isMac = /macintosh|mac os x/i.test(navigator.userAgent); if (agent.indexOf("win32") >= 0 || agent.indexOf("wow32") >= 0) {原创 2020-08-17 16:01:28 · 199 阅读 · 0 评论 -
electron的网络请求
electron的网络请求：使用Chromium的原生网络库发出HTTP / HTTPS请求net 模块是一个发送 HTTP(S) 请求的客户端API。 它类似于Node.js的HTTP 和 HTTPS 模块 ，但它使用的是Chromium原生网络库来替代Node.js的实现，提供更好的网络代理支持。实例GET请求：https://electronjs.org/docs/api/netco...原创 2020-08-14 14:09:54 · 3659 阅读 · 0 评论 -
react Antd 的面包屑与导航使用例子
使用面包屑，当点击不同二级导航，显示不同面包屑，代码重点是：在Layout渲染的页面中：import React from "react";import "./style.scss";import { Link } from "react-router-dom";import { observer, inject } from "mobx-react";import { Layout,...原创 2020-08-14 14:08:20 · 7775 阅读 · 0 评论 -
webpack的学习小计
1、Webpack作为前端构建工具的用途 文件在webpack01中代码转换：如ts转换为js文件优化：对文件进行压缩代码分割模块合并自动刷新代码校验自动发布2、安装webpack webpack-cli工具命令：npm install webpack webpack-cli -D里面的核心概念：入口 : 默认找的是src/index出口 ：自动打包出的文件是dist/main.jsloaderplugins：插件根据运行环境不同，js的写法也不相同，因一个js就是一个原创 2020-05-14 11:16:45 · 456 阅读 · 0 评论 -
闭包堆栈的小题
写出执行以下代码的结果：function fun(n, o) { console.log(o); return { fun: function (m) { return fun(m, n); } }; }...原创 2020-03-06 13:36:52 · 175 阅读 · 0 评论 -
面试题
1、编写plus和minus实现如下需求let n = 10;let m = n.plus(10).minus(5);console.log(m);此题写法：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewp...原创 2020-03-03 15:10:29 · 296 阅读 · 0 评论 -
js----hex（16进制）和字符串的互相转换
// hex转json字符串,16进制ASCIIvar hextoString = function (hex) { var arr = hex.split("") var out = "" for (var i = 0; i < arr.length / 2; i++) { var tmp = "0x" + arr[i * 2] + arr[i *...原创 2019-10-18 16:09:39 · 27039 阅读 · 7 评论 -
获取bootstrap-datetimepicker的值
<div class="form-group"> <label for="startTime">开始时间</label> <div class='input-group date' id='startTime'> <input type='text' cla...原创 2019-06-10 14:27:10 · 4510 阅读 · 0 评论 -
create-react-app与antd一起使用The "injectBabelPlugin" helper has been deprecated as of v2.0. You can use
全局安装create-react-appnpm install create-react-app -g//用它创建项目create-react-app react-demo//启动项目npm run start然后安装antdnpm install antd --save按需引入Ant-Design插件需要两个插件：1、react-app-rewired（一个对 cre...原创 2019-04-30 15:52:21 · 3975 阅读 · 7 评论 -
react+electron+AntD编辑桌面应用
一、开发的首要任务，安装node环境https://nodejs.org/zh-cn/，需要自行下载二、要下载react，有一个快捷的方法，创建react应用，使用脚手架，下载（可选择是否全局安装）：npm install --global create-react-app成功运行后会显示：三、创建react项目：create-react-app demo新建完后，按着步骤执行...原创 2019-03-01 16:45:27 · 11505 阅读 · 11 评论 -
electron中loadURL is not a function
在使用Electron结合React开发桌面应用的时候，遇到了一个bugelectron中loadURL is not a function：报错信息：网上看了好多解决这个问题的：但是electron4.0后，不在是这样的方式，而是：加载url地址的样子:显示：如果加载本地文件，在main.js中写：win.loadFile('public/index.html')显示...原创 2019-02-28 15:43:35 · 7958 阅读 · 4 评论 -
pkg学习--使用pkg打包应用
pkg的学习之旅 ----使用pkg打包Node.js应用将Node.js打包为可执行文件的工具有pkg、nexe、node-packer、enclose等，面对项目需要，所以在学习pkg,看到相关文章，觉得这个很不错，自己记录下，以便下次使用便捷。pkg的打包原理简单来说，就是将js代码以及相关的资源文件打包到可执行文件中，然后劫持fs里面的一些函数，使它能够读到可执行文件中的代码和资源文...原创 2019-02-28 11:36:31 · 14502 阅读 · 7 评论 -
electron主进程与渲染进程之间的交互--ipcMain-ipcRenderer
要学习主进程与渲染进程之间的交互，需要了解进程是什么、这二者的关是什么？参考：https://electronjs.org/docs/glossary#术语表进程：process一个进程是计算机程序执行中的一个实例。 Electron 应用同时使用了 main(主进程) 和一个或者多个 rendere(渲染进程) 来运行多个程序。在 Node.js 和 Electron 里面，每个运行的...原创 2019-02-28 11:27:37 · 5924 阅读 · 10 评论