陈一手-CSDN博客

原创页面全屏模式

创建一个js文件 fullScreenFc.js class fullScreen { /** * @description: 全屏初始化 * @param {Function} fn 用户浏览器不支持全屏的回调 */ constructor(fn) { this.prefixName = ""; // 浏览器前缀 this.isFullscreenData = true; // 浏览器是否支持全屏 this.isFullscreen(fn);

2020-11-19 17:27:26 411

原创 video播放和监听结束

开始播放var video = document.getElementById("shiping-logo-vide"); video.play();暂停播放var video = document.getElementById("shiping-logo-vide"); video.pause(); //暂停控制监听播放结束var elevideo = document.getElementById("video"); elevideo.addEventLi

2020-10-30 09:08:29 6392 2

原创请求封装

上次我们封装了请求方法这次我们封装一下接口请求import {post,put,get } from '/axios';//如get请求export const get = (params) => { return get('请求地址',params)}export const post = (params) => { return post('请求地址',params)}封装axios请求地址...

2020-10-27 14:45:31 261

原创最简单的加密方式,AES

创建utls.js文件import Vue from 'vue'import CryptoJS from 'crypto-js'export default {//加密 encrypt(word, keyStr){ keyStr = keyStr ? keyStr : 'dsadjsahdklsahdjsakhdsak'; //abcdefgabcdefg121978925762 var key = CryptoJS.enc.Utf8.parse(keyStr);//Lati

2020-08-10 09:35:00 411

原创一些Vue的性能优化

代码优化模块化、组件化组件是把常用的东西封装起来，最重要的就是复用。模块是把同一功能或业务的代码进行分离，降低模块间的耦合性，可以独立运行和管理。包括css也可以通过less和sass来减少重复代码。v-for 的 key在使用v-for渲染元素列表时，为每一项都设置唯一的key值，为了让Vue内部更快的定位到该条数据。我们都知道尽量不要使用index下标作为key值，例如：let arr = [ { id: 1, title: 'one' }, { id: 2, t

2020-07-29 14:49:21 377

原创各种js数组操作

随机排序1、生成随机数遍历数组，每次循环都随机一个在数组长度范围内的数，并交换本次循环的位置和随机数位置上的元素function randomSort1(arr) { for (let i = 0, l = arr.length; i < l; i++) { let rc = parseInt(Math.random() * l) // 让当前循环的数组元素和随机出来的数组元素交换位置 const empty = arr[i] arr[i] = arr[rc]

2020-07-29 11:33:39 351

原创 axios请求封装

创建一个axios.js文件import axios from 'axios';import baseUrl from '../utils/baseUrl';const config = { baseURL: baseUrl() || "", timeout: 60 * 1000, // Timeout withCredentials: true, // Check cross-site Access-Control }; const _axios = axios.

2020-07-29 09:54:50 282

原创如何实现防抖和节流，以及他们的使用场景是什么？

防抖防抖，顾名思义，防止抖动，以免把一次事件误认为多次，敲键盘就是一个每天都会接触到的防抖操作。想要了解一个概念，必先了解概念所应用的场景。在 JS 这个世界中，有哪些防抖的场景呢登录、发短信等按钮避免用户点击太快，以致于发送了多次请求，需要防抖调整浏览器窗口大小时，resize 次数过于频繁，造成计算过多，此时需要一次到位，就用到了防抖文本编辑器实时保存，当无任何更改操作一秒后进行保存代码如下，可以看出来「防抖重在清零」function debounce (f, wait) { le

2020-07-13 15:38:43 749

原创 input输入内容处理

输入框不能输入特殊字符在vue mian.js全局定义方法//全局定义输入框的特殊字符处理Vue.prototype.validForbid = function (value) { value = value.replace(/[`~!@#$%^&*()_\-+=<>?:"{}|,./;'\·~！@#￥%……&*（）——\-+={}|《》？：“”【】、；‘’，。、]/g, '').replace(/\s/g, ""); return value;}使用方法.

2020-07-13 10:42:26 766

原创输入框input只能输入数字和小数点

输入框input只能输入数字和小数点只允许输入数字(整数：小数点不能输入)允许输入小数(两位小数)<input type="text" onkeyup="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*$/g, '$1')" >允许输入小数(一位小数)<input type="text" onkeyup="value=value.replace(/^\D*(\d*(?:\.\d{0,1})?).*$/g, '$1')" >开

2020-07-13 10:11:22 579

原创 vue配置开发环境和测试环境

构建打包环境在vue.config.js文件中设置代理module.exports = { productionSourceMap:false, outputDir:process.env.NODE_ENV == 'production'?'dist':'test', //构建打包目录 devServer:{ proxy:'http://test.haitao.api.dxanm.com' }}创建.env.test文件NODE_ENV = 'ua

2020-06-19 11:57:12 738

原创 webpack初体验

核心概念webpack 是一个现代 JavaScript 应用程序的模块打包器(module bundler)。当 webpack 处理应用程序时，它会递归地构建一个依赖关系图(dependency graph)，其中包含应用程序需要的每个模块，然后将所有这些模块打包成少量的 bundle - 通常只有一个，由浏览器加载。webpack中文文档安装和配置一.安装npm init -y ...

2020-03-15 22:50:29 143

原创 react介绍与脚手架搭建

React 背景介绍React 起源于 Facebook 的内部项目，因为该公司对市场上所有 JavaScript MVC 框架，都不满意，就决定自己写一套，用来架设 Instagram 的网站。做出来以后，发现这套东西很好用，就在2013年5月开源了。什么是React用来构建UI的 JavaScript库React 不是一个 MVC 框架，仅仅是视图层的库react 官网react...

2020-02-27 20:19:46 263

原创一篇文章让你会用react路由

react路由安装 react-router-domnpm安装 npm i react-router-domyarn安装 yarn add react-router-dom下载到生产环境的依赖中。引入模块在react脚手架src目录下的 index.js里引入安装好的react-router-dom插件import { BrowserRouter as Router } f...

2020-02-23 15:39:45 255 2

原创 Get和Post的区别

Get和Post的区别一、原理区别一般我们在浏览器输入一个网址访问网站都是GET请求;在FORM表单中，可以通过设置Method指定提交方式为GET或者POST提交方式，默认为GET提交方式。根据HTTP规范，POST可能会修改服务器上的资源的请求。比如CSDN的博客，用户提交一篇文章或者一个读者提交评论是通过POST请求来实现的，因为再提交文章或者评论提交后资源（即某个页面）不同了，或者说...

2019-12-27 18:34:56 267

YuT_ian的博客