- 博客(27)
- 收藏
- 关注
RSS订阅原创 vue监听localstorage值变化
在vue中实现监听localstorage中某个键对应的值的变化在根目录下创建一个名为utils的文件夹,在文件夹中创建一个tool.js文件//****将这段内容放在tool.js文件中****// 重写setItem事件，当使用setItem的时候，触发，window.dispatchEvent派发事件function dispatchEventStroage() { const signSetItem = localStorage.setItem localStorage.se
2021-09-06 09:32:41
14134
8
原创 input图片上传
input图片上传 <label for="file" class="btn btn-default">更换头像</label> <input id="file" type="file" @change="getImg" accept="image/*" style="display:none" />.btn-default { font-size: 14px; margin-left: 10px; border-radius: 3px; bord
2021-04-30 09:42:32
535
原创 app微信登陆 获取code等信息
app微信登陆 获取code等信息// #ifdef APP-PLUS plus.oauth.getServices(function(servies) { var auths = servies; var s = auths[1]; if (!s.authResult) { s.authorize(function(e) { console.log('获取code!' + JSON.stringify(e)); uni.sho
2021-04-29 20:35:41
760
原创 vue 3.x 不支持filters的解决方案
vue 3.x 不支持filters的解决方案一、简单的操作可以在v-for中使用<div v-for="(item,index) in list.filter(item => if(item){return item}else{return "没有内容"})" :key="index"></div>二、复杂的操作可以在全局定义filtervar app = createApp(app)app.config.globalProperties.$filters =
2021-01-08 10:11:00
1198
原创 vant loading
vant中loading加载//创建vant loading加载 const toast = vant.Toast.loading({ duration: 0, // 持续展示 toast forbidClick: true, message: "加载中..." }); toast.clear()//清除加载
2020-12-02 13:05:12
6626
原创 audio标签后台播放
使用audio标签后台进行播放通过audio标签里包一个source标签后台就可以进行播放<audio> <source src="url" type="audio/mpeg" /> </audio>
2020-11-20 15:56:17
758
原创 vue 移动端 拖拽
创建一个div，因为是移动端的，所以用touchmove事件，触发一个函数。（里边的span标签是为了使用iconfont）<template> <div> <div class="active" id="active" :style="{top:top,left:left}" @click="onClick" @touchmove="onmove" > <span class="iconfont icon-youjia
2020-06-24 10:14:03
603
原创 http学习(3)
域名：是一个名字便于记忆。当我们访问某一个网址时，其实我们用的是ip一串数字。共同语言，就是http协议。当我们访问一个网页都经历了哪写步骤：1.客户端发送请求2.浏览器域名查询3.DNS服务器解析4.浏览器获取DNS服务器解析出来的IP5.浏览器向WEB服务器发送请求6.WEB服务器传回给浏览器页面内容7.浏览器拿到内容渲染页面HTTP协议超文本传输协议（HTTP）是一种通信协议，它允许将超文本标记语言（HTML）文档从WEB服务器传送到客户端的浏览器。
2020-06-19 23:07:39
239
原创 http学习（2）
请求和响应请求过程是：（请求行、头信息+空一行/换行、主体信息（可选） ） #### 请求行：请求方法 路径 协议头信息：格式为key:value空行主体信息（可选）（发送内容）例：POST/0606/02.php HTTP/1.1Host:localhostContent-type: application/x-www-form-urlencodedContent-length:5Age=3响应行（协议 状态码 状态文字）响应头信息（格式为..
2020-06-18 19:41:17
104
原创 postman使用
一、postman背景介绍 用户在开发或者调试网络程序或者是网页B/S模式的程序的时候是需要一些方法来跟踪网页请求的，用户可以使用一些网络的监视工具比如著名的Firebug等网页调试工具。今天给大家介绍的这款网页调试工具不仅可以调试简单的css、html、脚本等简单的网页基本信息，它还可以发送几乎所有类型的HTTP请求！Postman在发送网络HTTP请求方面可以说是Chrome插件类产品中的代表产品之一。1. 抓取和分析现有网站请求这个功能需要Postman Interceptor...
2020-06-15 21:02:00
186
原创 webpack
如何省略 path.resolve在webpack.config.js中添加一个配置项resolveLoader:{//当引入一个module就会先去node_modules去找，如果没有就会去‘loaders’中去找modules:['node_modules','./loaders']}如果编写一个PluginPlugin是什么，打包时，在某些时刻上，去做一些操作。首先创建一个npm包npm init -y创建一个src文件夹在文件夹中创建一个index.js根...
2020-06-15 20:31:05
101
原创 webpack使用自定义loader
配置的loader也可以改为module:{ rules:[ { test:/\.js/, use:[ { loader:path.resolve(__dirname,"./loaders/replaceLoader.js"), options:{ name:'lee' ...
2020-06-14 23:02:53
985
原创 webpack学习
控制包文件大小（打包时我们的包要尽可能的小，为了提升打包速度） thread利用node里的多进程打包 thread-loader （多进程打包，根据自己需要进行使用） parallel-webpack（多页面一起打包） happypack官方文档合理使用sourceMap(sourceMap越详细打包越慢)；结合stats分析打包结果开发环境内存编译（编译记录在内存里）开发环境中不要用无用的插件。剔除无用插件。多页面打包配置webpack....
2020-06-12 22:02:10
91
原创 webpack提升打包速度
提升webpack打包速度的方法(1) 1.跟上技术迭代（node、npm 、yarn）更新到最新版本。（人家会优化内部） 2.在尽可能少的模块上应用Loader 3.Plugin尽可能精简并确保可靠 （尽可能少的使用）resolve参数合理配置 打开.babelrc文件， 如果配置有“@babel/preset-react”,就可以在组件中写react代码。 如果我们用 .jsx 引入之后我们需要配置。 ...
2020-06-11 22:06:36
361
原创 webpack学习笔记 （简单打包库）
Library的打包//库文件夹 第一步初始化 npm init -y 创建一个package.json文件 创建一个文件夹 src 在src文件夹下创建。 创建一个文件math.js //写入函数加减成除 创建一个文件string.js //写入关于字符串的处理函数 创建一个index.js文件 //引入上边的两个文件，并导出，这就是一个库 webpack对于刚才的库打包 需要配置：webpack.config.js output:{...
2020-06-10 18:41:21
219
原创 webpack学习笔记
同步代码打包和异步代码打包 都需要安装 splitChunkePlugin 官网配置 https://webpack.js.org/plugins/split-chunks-plugin/#defaults具体配置的意思： module.exports = { //... optimization: { splitChunks: { //只对异步代码分割打包有作用， chunks: 'async',//如果变成all需要配置下边的vend...
2020-06-09 19:09:00
238
原创 webpack学习笔记
按需引入打包 配置，使用tree shaking方法 tree shaking 只支持ES module (import from 静态引入) 如果使用tree shaking需要加optimization webpack.config.js//production环境下不需要这个配置optimization:{ usedExports:true } package.json中添加配置 "sideEffects"...
2020-06-08 20:41:03
113
原创 字符串操作方法
indexOf()//返回查找某一个字符串第一次出现的下标//定义字符串String.indexOf("要查找的字符串",从哪一下标开始)返回第一次出现的下标slice() //截取字符串两个参数第一个是开始的下标，第二个是结束的下标，如果第一个参数是负数就是倒数下标。str.slice(开始的位置，结束的位置)split() //将字符串拆分，两个参数，一个是要拆成用什么符号拼接的字符串，第二个是匹配的位数，比如3就是三个连接的字符串才拼到一起，其他的不截取。s..
2020-06-07 20:42:23
118
原创 webpack学习记录
entry和output基本配置： entry是打包的入口文件： 后边是字符串路径,要打包的文件。 默认打包的文件叫main.js 如果想打包两次同样的代码，可以在entry中加一个 entry：{ main:'./src/index.js', sub:'./src/index.js' ...
2020-06-06 15:19:37
96
原创 webpack打包css与字体文件
CSS文件处理问题： 我们引入import “index.css”; 在webpack.config.js配置修改； module:[ { test:/\.css$/, //把use改成数组，添加一个对象,安装并使用，style-loager和css-loader use:['style-loager','css-loager'] }...
2020-06-04 13:55:14
1056
原创 初学 webpack
webpack初学 使用webpack，webpack的特性： 1.treeshaking 2.代码懒加载 3.代码分割 webpack4的特点： 1.速度快，大型项目节约90%构建时间 2.内置更多的默认配置，变更了许多API webpack基础知识： ...
2020-06-03 14:05:36
195
原创 使用 码云
码云是什么？ 码云是和github类似的代码托管平台，不过码云是国内使用量大，而github国外使用比较多，为了以后忘记方便查看回忆，记录一下。一、在码云上注册账号 点击注册进入注册页面填写相应的信息。二、安装git 官网地址：https://git-scm.com/downloads点击下载Windows的2.27.0下载进入页面下载64位的，然后安装。三、在码云上创建远程仓库 1. 登...
2020-06-02 18:35:07
1281
原创 复选框阻止事件冒泡
数据渲染列表复选框阻止默认事件//用prevent可以让复选框的状态是:checked="item.state"的这个状态，不会因为事件冒泡而出现错误<input type="checkbox" :checked="item.state" v-on:click.prevent="onClick" />...
2020-04-24 22:34:47
837
原创 React 路由
React 路由一 、 认识路由/配置环境1. BrowserRouter和HashRouter的区别1）BrowserRouter as Router表示使用Router就是使用BrowserRouter2）exact表示指定path只有在访问’/'的时候才展示component={Landing}里面的组件,这个属性可选择性使用3） HashRouter 表示使用Router是使...
2019-12-24 17:43:42
83
原创 ToDoList 增删改查
ToDoList主要功能增加数据删除数据修改数据查询数据渲染页面1 . HTML页面<!DOCTYPE html><html lang="en"> <head> <meta charset="utf-8" /> <link rel="icon" href="%PUBLIC_URL%/favicon.ico" ...
2019-12-23 20:37:56
281
3
原创 React 传参
React 传参一、父传子 一 . 1 HTML页面（接下来的父传子、子传父、兄弟相传，都用此页面，并且class中的排版需要遵守JSX的语法格式）<!DOCTYPE html><html lang="en"> <head> <meta charset="utf-8" /> <link rel="icon" hr...
2019-12-19 20:01:04
340
1
原创 React class
React中Class的概念一、简介 javaScript是面向对象的编程语言，可以说所以的能够被描述的事、物或抽象的东西，都是可以是对象。而我们记录的对象，会有具有同样的属性和行为。为了节省重写相同的代码。就产生了class模板。举例：这里有一把枪, 枪的种类很多，有步枪，机关枪，阻击枪…。但是无论怎么说，这些都是枪的概念，如果把这种抽象的概念剥离出来，就是我们经常说的“...
2019-12-18 19:39:26
347
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人