- 博客(53)
- 收藏
- 关注
RSS订阅转载 vue3 使用socket
服务端配置服务端 socket server.js （我这里是用node写的， java同理）如果使用 express 需要在安装下 expressnpm install express --sevenpm install socket.io --saveserver.js 服务端const express = require('express')let fs = require('fs')const app = express()let port = 3002...
2022-05-27 16:05:21
1027
转载 58个面向 Web 开发人员的JavaScript技巧汇总
1、比较时间const time1 = "2022-03-02 09:00:00";const time2 = "2022-03-02 09:00:01";const overtime = time1 < time2;// overtime => true2、格式化moneyconst ThousandNum = num => num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");const money = Thousan
2022-04-18 14:05:35
133
原创 electron高版本使用BrowserWindow
父窗口打开子窗口，使用remote模块的时候，出现了以下的问题：const BrowserWindow = require('electron').remote.BrowserWindow解决方案：1、首先在自己项目中npm安装 @electron/remote模块yarn add @electron/remote2、在主进程初始化@electron/remote模块，然后在渲染中使用require('@electron/remote/main').ini...
2022-01-19 14:29:30
531
原创 vuecli+electron 打包配置
在项目根目录下，新建 vue.config.js 文件，文件内容如下，可据自己的具体情况做相应更改；vue.config.js文件：module.exports = { publicPath: process.env.NODE_ENV === 'production' ? './' : '/', pluginOptions: { electronBuilder: { builderOptions: { 'app...
2022-01-13 13:54:23
587
2
原创 Electronstore-渲染进程卡死原因
electron-store版本为:"electron-store": "^8.0.1"应用时须要在主过程background.js初始化const Store = require('electron-store'); // 初始化 Store.initRenderer();再渲染过程应用const store = new Store();//如果需要加密存储 就用下面的//const store = new Store({encryptionKey: '加密值'}); st
2022-01-13 10:39:08
1146
转载 vue全家桶之vue-cli简介和npx 的基本使用
vue-cli是一个脚手架可以快速去构建基于vuejs项目（快速的组织一些页面的结构，引入 vuejs 单组件的管理方式）。注意：目前 vue-cli 的版本是4.x（刚刚升级上来的，之前一直使用的都是 2.x 版本，并且 2.x 的版本的使用和3.x版本的使用稍微有些不一样的）。vue-cli的安装npm install -g @vue/cli# ORyarn global add @vue/cli注意无论使用的 npm 或者 yarn 都是全局。现在我们需要注意一些事情，现在企业开发项
2021-12-01 15:52:43
895
转载 常用的15个国外网站
1.Random-Image-Api地址：https://source.unsplash.com/Random-Image-Api 一个能够获取随机图片的 Api，基于 Spring Boot 构建可读取本地图片列表的地址，并提供随机访问服务，可配置域名白名单访问。2. Carbon地址：https://carbon.now.sh/你见过推特上面的 这 些 代码 图片 吗? 虽然这些代码图片给人印象深刻，但就审美程度来说还有可改进的地方。Carbon 可以很容易的为你的代码创建漂亮的
2021-09-27 10:07:33
75431
2
转载 10个清晰实用更显专业的JavaScript代码片段
你可能熟悉这样的常规if-else语句：if(10<100){console.log("True");}else{console.log("False");}输出True但是，你知道吗，你可以通过使用三元运算符，以更短，更简洁的方式编写上面的代码？10<100？console.log（“True”）：console.log（“False”）输出：True通常，三元运算符遵循以下简单模式：condition ? true...
2021-09-18 15:53:14
66
转载 花里胡哨的JS 装逼大法
1、最简单的单行评级组件"★★★★★☆☆☆☆☆".slice(5 - rate, 10 - rate);定义一个变量 rate 是 1 到 5 的值，然后执行上面代码，如下：这才发现其他插件都弱爆了呀！2、JS 错误处理的方式的正确姿势（直接定位错误原因）try { // something} catch (e) { window.location.href = "http://stackoverflow.com/search?q=[..
2021-09-18 15:49:11
86
转载 JavaScript 复杂判断的更优雅写法
嗯，这样看起来比if/else清晰多了，细心的同学也发现了小技巧，case 2和case 3逻辑一样的时候，可以省去执行语句和break，则case 2的情况自动执行case 3的逻辑。这时有同学会说，还有更简单的写法：constactions={'1':['processing','IndexPage'],'2':['fail','FailPage'],'3':['fail','FailPage'],'4':['success','SuccessPage']...
2021-04-13 11:04:44
119
原创 h5 底部按钮兼容 iPhone （解决底部横杠遮挡问题）
iOS特性方法（推荐），小程序也可用padding-bottom: constant(safe-area-inset-bottom); /*兼容 IOS<11.2*/padding-bottom: env(safe-area-inset-bottom); /*兼容 IOS>11.2*/<!DOCTYPE html><html lang="en"> <head> <meta charset="utf-8"> <ti
2021-03-25 16:59:50
1994
原创 vue移动端适配
基础点：rem相对根节点<html>字体的大小。所以不用px;根字体：<html>字体的大小px;px：你就当成cm(厘米)这样的东西吧；基准：750设计稿；目标一 、手机适配：就是页面上的尺寸，无论高度，还是宽度，还有字体，随屏幕的宽度变化！这里是屏幕宽度！是不是想到了vw，对，就是这个意思；——最大程度在各个尺寸屏幕上还原设计稿目标二、px转换成rem：一般UI给的设计稿宽度大小是750，所以，我们想直接写上面UI标记的尺寸；——最大程度减少工作为什么选择rem.
2021-02-08 16:50:32
139
原创 vue - 针对单个 js 文件禁用 ESLint 语法校验
在 Vue-cli 创建的项目中，使用了 ESLint 规范代码,在使用一些老版本的vue库的时候，语法不符合ESLint会导致项目报错无法通过编译。如何针对单个 js 文件禁用 ESLint 语法校验，但整个项目依然保留 ESLint 的校验规则？解决方案：在代码顶部添加一行注释，即可禁用 ESLint 语法校验/* eslint-disable */...
2021-01-26 17:30:07
383
原创 vue项目手机端适配
1、安装 flexible和 postcss-px2remyarn add lib-flexible --saveyarn add postcss-px2rem --save2、 引入lib-flexible在项目入口文件main.js 中引入lib-flexibleimport ‘lib-flexible’注意事项（important）: 由于flexible会动态给页面header中添加标签，所以务必请把目录 public/index.html 中的这个标签删除！！！3、配置
2021-01-05 15:43:57
3771
原创 js 取得当天0点 / 23:59:59 时间
js 取得今天0点：const start = new Date(new Date(new Date().toLocaleDateString()).getTime());console.log(start); //Mon Dec 04 2017 00:00:00 GMT+0800 (中国标准时间)同理算出：js 取得今天 23:59:59const end = new Date(new Date(new Date().toLocaleDateString()).getTime()+2
2020-10-15 09:22:38
240
原创 后台传递list和选中数组，前端选择添加删除并传递后台选中列表
<block wx:for="{{gradeList}}" wx:key="id"> <view class="chooseItem gradeItem {{item.checked == true ? 'activeGrade' : ''}}" data-idx="{{item.gradeId}}" bindtap="chooseOilsBtn"> ...
2020-09-23 13:47:31
138
原创 微信小程序获取地理位置
要点：获取地理位置时，如果获取地理位置失败，有两种情况：1、用户未给小程序授权地理位置信息2、系统设置中-隐私选项地理位置未开启或系统未给微信授权地理位置信息在获取地理位置信息失败后，判断用户是否有为小程序授权地理位置，如果未授权，则是第一种情况，打开地理位置授权即可；但是进入了fail函数，并且已有地理位置授权，说明是第二种情况，需要用户在系统设置中打开定位和授权。代码如下： // 调用地理位置授权 getLocation() { const tha
2020-09-16 15:25:29
798
原创 store 之 控制 loading 显示隐藏
contentLoading.js:// typesexport const LOADING = "LOADING";const resource = { state: { loading: false }, actions: { contentLoading(context, params) { context.commit("LOADING", params); }, }, mu
2020-09-05 15:11:01
328
原创 VUE-elementUI 请求封装
import axios from "axios";import store from "@/utils/store";import router from "@/router";import { Loading, Message } from "element-ui";const config = { baseURL: process.env.VUE_APP_URL, timeout: 60000, validateStatus: function(status) {.
2020-09-05 15:00:05
707
原创 vue-elementUI 之 全局配置
// 点击 遮罩层 是否关闭 DialogElementUI.Dialog.props.closeOnClickModal.default=false;// Dialog 是否在 body 里追加ElementUI.Dialog.props.modalAppendToBody.default=false;// 分页默认ElementUI.Pagination.props.layout.default="prev, pager, next, jumper";ElementUI.Paginati.
2020-09-05 14:44:04
1385
原创 微信小程序 之 40029
开发版正常使用，但是生成体验版之后报 40029错误。错误原因：1：openid 和 当前小程序不对应，或者AppSecret 秘钥和当前小程序不对应的。2：当前小程序能正确获取到token，但是在code还没有失效时，另一个小程序也用这个小程序的openid或者AppSecret 秘钥去请求token。这个时候也会报40029，说到底还是第一个错误，只是触发的方式不同。解决办法也很简单，检查一下，当前的openid 和AppSecret是否和当前要部署使用的小程序的openid 和Ap..
2020-09-05 14:35:46
343
原创 微信小程序配置之 useCompilerModule
是否开启 CompilerModule 混合打包工具作用：解决 未找到入口 sitemap.json 文件，或者文件读取失败，请检查后重新编译 的问题
2020-09-05 14:32:46
1890
原创 Vue CLI 3 配置之 productionSourceMap
问题： 可能很多人在做vue项目打包，打包之后js中，会自动生成一些map文件，这些文件导致文件过大，加载比较缓慢，那么怎么去掉这些文件呢？运行yarn build 开始打包后会在项目目录下自动创建dist目录，打包好的文件（包括.map）都在其中解决办法：在 vue.config.js 中添加一个参数productionSourceMap:false把这个改为false。不然在最终打包的文件中会出现一些map文件map文件的作用：项目打包后，代码都是经过压缩加密的，如果运..
2020-08-31 09:47:41
1005
1
原创 uni 小程序文字变化动画
wxml：<view class='detailTopTextCon'> <label class='detailTopText detailTopText1 detailTopAnimate1'>{{showData.text1}}</label> <label class='detailTopText detailTopText2 detailTopAnimate2'>{{showData.text2}}</label> ..
2020-08-29 16:30:01
358
原创 vue-cli配置开发、测试、生产环境
场景描述：为了在测试过程中，不用反复修改环境信息。xian1.根目录创建.env.dev、.env.test、.env.pro文件(开发、测试、生产)2.文件内容及字段说明NODE_ENV:可以设置为其他值，比如"test",但是打包后的目录结构和"production"不一样，所以还是设置为"production",通过"VUE_APP_MODE"变量来区分环境 VUE_APP_MODE:线上测试环境 VUE_APP_API_URL:api调用地址3. .env.dev内容...
2020-08-26 14:18:05
840
原创 微信小程序 之 发布流程
1.前期准备先想好你的小程序是用来做什么的，是电商、服务预约、知识付费、产品展示、还是团队管理、酒店预订？主要面向的人群都是哪些？现在小程序类型繁多，你一定要对自己有清晰的定位、明确的目标，才能避免把小程序做得乱七八糟，让自己的小程序真正有用。2.申请账号然后，你就可以开始申请小程序账号了。这里给大家科普一下微信小程序申请流程：进入微信公众平台，点击“立即注册”，选择账号注册类型：小程序。填写小程序账号信息后，系统会发给注册邮箱一个确认邮件，确认激活即可。激活后，设置小程序的最后一步信息
2020-08-20 12:04:35
2440
原创 Error: ENOENT: no such file or directory, scandir ‘E:\MyWorkSpaces’
在使用npm安装node-sass的时候，可能会出现如下的报错：Error: ENOENT: no such file or directory, scandir 'E:\MyWorkSpaces\GitResource\node_modules\.npminstall\node-sass\3.7.0\node-sass\vendor' at Error (native)解决方案是执行以下方法：npm rebuild node-sass...
2020-08-06 12:21:40
388
转载 微信小程序之支付密码输入
wxml：<view catchtap='showInputLayer' class="btn_pay">立即支付</view><!-- 密码输入框 --><view wx:if='{{showPayPwdInput}}'> <view class='bg_layer'></view> <view class='input_main'> <view class='input..
2020-08-06 11:28:52
2343
转载 小程序生日选择
创建生日组件：wxml：<!--components/timePicker/timePicker.wxml--><!-- 自定义时间筛选器 --><view catchtouchmove="preventD" hidden="{{!pickerShow}}"> <view class="picker-container {{pickerShow?'show_picker':'hide_picker'}}" animation="{{animatio
2020-08-03 09:49:30
1725
1
转载 Vue项目更丝滑的几个小技巧
数据不响应，可能是用法有问题:比如下面这段代码:<template><div><div><span>用户名:{{userInfo.name}}</span><span>用户性别:{{userInfo.sex}}</span><span v-if="userInfo.officialAccount">公众号:{{u...
2020-07-21 09:42:27
351
原创 Vue刷新页面的三种方式
原始方法： location.reload(); vue自带的路由跳转： this.$router.go(0) 前两者都是强制刷新页面，会出现短暂的闪烁，用户体验效果不好。 所以，我们选择第三种方式： 首先在App里面写下如下代码： <template> <el-container class="home"> <router-view class="main" v-if="isRouter...
2020-06-29 11:14:26
256
原创 解决Element-UI 侧边栏页面刷新后不高亮显示的问题
<el-menu class="el-menu-vertical-demo" :default-active="$route.path"> <template v-for="item in list"> <router-link :to="{path:item.url}" v-if="item.children" :key="item.name"> <el-submenu :index="item.url" @cli.
2020-06-28 10:55:52
591
原创 vue中input输入框触发功能父子组件传值
子组件：<template> <div class="inputTip"> <el-input v-model="currentValue" @input="childClick"></el-input> <el-tooltip class="item" effect="dark" :content="msg" placement="top"> <i class="el-icon-warning-outl
2020-06-15 14:29:26
2404
转载 前端常用60余种工具方法
1.邮箱export const isEmail = (s) => { return /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/.test(s)}2.手机号码export const isMobile = (s) => { return /^1[0-9]{10}$/.test(s)}3.电话号码export const isPhone = (s) =>
2020-05-29 09:44:39
217
原创 vue 菜单路由重复点击报错
原因:未知解决方法：在当前页面添加:import Router from 'vue-router'const originalPush = Router.prototype.push;Router.prototype.push = function push(location) { return originalPush.call(this, location).catch(err => err)};
2020-05-26 11:37:32
329
原创 vue基础知识点
说说你对MVVM的理解 Model-View-ViewModel的缩写，Model代表数据模型，View代表UI组件，ViewModel将Model和View关联起来。 数据会绑定到viewModel 层并自动将数据渲染到页面中，视图变化时候会通知viewModel层更新数据。 vue2.x响应式数据/双向绑定原理 Vue数据双向绑定主要是指：数据变化更新视图，视图变化更新数据。其中，View变化更新Data，可以通过实践监听的方式来实现，所以Vue数据双向绑定的的工作主要是如.
2020-05-25 11:52:07
419
转载 36个工作中常用的JavaScript函数片段
作者：爱前端不爱恋爱链接：https://zhuanlan.zhihu.com/p/141031060来源：知乎著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。数组 Array数组去重function noRepeat(arr) { return [...new Set(arr)];}查找数组最大function arrayMax(arr) { return Math.max(...arr);}查找数组最小function ar.
2020-05-18 14:06:01
136
原创 基于Element-UI的组件改造的树形选择器（树形下拉框）
前言：由于做项目需要一个树形选择器，项目用的也是element-ui框架，然而它自带的选择器组件没有树形选项，又不想引入其他的框架组件，于是自己利用el-select和el-tree改造了一个，感觉还挺好用的，就封装成了一个组件，如下图：element-ui的el-select组件的选项只能是列表形式：改造后的树形选择器：简介：此树形选择器组件是基于elment-ui框架的el-sel...
2019-12-12 15:53:40
1775
转载 Web常见攻击总结
首先简单介绍几种常见的攻击方式： SQL注入 XSS CSRF 点击劫持 中间人攻击 1 SQL 注入这是一种比较简单的攻击方式。如果后台人员使用用户输入的数据来组装SQL查询语句的时候不做防范， 遇到一些恶意的输入，最后生成的SQL就会有问题。举个例子比如地址栏输入的是：articlrs/index.ph...
2019-12-06 17:57:48
170
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人