首页
更多应用
Search
1
修改iview的标签为i-的形式而不是驼峰的形式
2,791 阅读
2
PHP微信和企业微信签名
2,522 阅读
3
在VUE中怎么全局引入sass文件
2,223 阅读
4
vscode硬件占用较高解决方案
2,017 阅读
5
解决Macos下storm系列IDE卡顿的问题
1,975 阅读
默认分类
JS
VUE
CSS
mac使用技巧
React
fastmock
登录
/
注册
Search
标签搜索
react
js
vue
vscode
nodejs
项目
代码
webpack
工具
nginx
小程序
css
fastmock
eslint
npm
http
vue-cli3
git
浏览器
const
fastmock技术社区
累计撰写
102
篇文章
累计收到
26
条评论
首页
栏目
默认分类
JS
VUE
CSS
mac使用技巧
React
fastmock
页面
更多应用
搜索到
102
篇与
的结果
2021-05-26
css 缩小图片后,图片变模糊的解决办法
问题描述:样式设置图片宽高后,图片缩小变的模糊了。如何解决图片模糊问题?解决办法:样式表中加入以下样式即可解决img { image-rendering:-moz-crisp-edges; image-rendering:-o-crisp-edges; image-rendering:-webkit-optimize-contrast; image-rendering: crisp-edges; -ms-interpolation-mode:nearest-neighbor; }
2021年05月26日
465 阅读
0 评论
0 点赞
2021-04-25
fastmock 支持不同格式数据返回
Content-Type 数据格式应许多用户的要求,现不断加入不同的数据格式支持,使用方式很简单,在请求头中加入 Content-Type 字段来告诉 fastmock 您需要返回什么格式的内容即可:如:使用 axios 作为 ajax 库时axios.defaults.headers.common['Content-Type'] = 'application/json;charset=UTF-8';录入数据时,还是录入 json 数据,还是可以正常使用 mockjs 模拟一切数据现已支持的数据类型数据类型Content-Type 值jsonapplication/jsonxmltext/xml使用示例录入规则{ data: [{ name: '张三' },{ name: 'lisi' }] }postman 请求 jsonpostman 请求 xml
2021年04月25日
404 阅读
0 评论
0 点赞
2021-04-18
jsplumb 开发文档收集
jsplumb基本概念https://www.jianshu.com/p/0e7bb5c081c8https://www.jianshu.com/p/0e7bb5c081c8jsplumb 阅读笔记(英文文档翻译)https://www.cnblogs.com/ysx215/p/7615677.html拓扑图编辑器-jsplumb基本配置https://www.jianshu.com/p/d68a8e61ff2d【原英文文档】https://docs.jsplumbtoolkit.com/community/current/articles/connections.html#detachinggithub 中文文档https://github.com/MarvenGong/jsplumb-chinese-tutorial
2021年04月18日
228 阅读
0 评论
0 点赞
2021-03-26
MySql连接和状态查看方法
怎么进入mysql命令行呢? mysql的安装目录下面有个bin目录,先用命令行进入该目录,然后用 mysql -uroot -p123456 来登录(注意:用户名和密码不用包含“”)命令: show processlist;如果是root帐号,你能看到所有用户的当前连接。如果是其它普通帐号,只能看到自己占用的连接。show processlist;只列出前100条,如果想全列出请使用show full processlist;mysql> show processlist;命令: show status;命令:show status like '%下面变量%';Aborted_clients 由于客户没有正确关闭连接已经死掉,已经放弃的连接数量。Aborted_connects 尝试已经失败的MySQL服务器的连接的次数。Connections 试图连接MySQL服务器的次数。Created_tmp_tables 当执行语句时,已经被创造了的隐含临时表的数量。Delayed_insert_threads 正在使用的延迟插入处理器线程的数量。Delayed_writes 用INSERT DELAYED写入的行数。Delayed_errors 用INSERT DELAYED写入的发生某些错误(可能重复键值)的行数。Flush_commands 执行FLUSH命令的次数。Handler_delete 请求从一张表中删除行的次数。Handler_read_first 请求读入表中第一行的次数。Handler_read_key 请求数字基于键读行。Handler_read_next 请求读入基于一个键的一行的次数。Handler_read_rnd 请求读入基于一个固定位置的一行的次数。Handler_update 请求更新表中一行的次数。Handler_write 请求向表中插入一行的次数。Key_blocks_used 用于关键字缓存的块的数量。Key_read_requests 请求从缓存读入一个键值的次数。Key_reads 从磁盘物理读入一个键值的次数。Key_write_requests 请求将一个关键字块写入缓存次数。Key_writes 将一个键值块物理写入磁盘的次数。Max_used_connections 同时使用的连接的最大数目。Not_flushed_key_blocks 在键缓存中已经改变但是还没被清空到磁盘上的键块。Not_flushed_delayed_rows 在INSERT DELAY队列中等待写入的行的数量。Open_tables 打开表的数量。Open_files 打开文件的数量。Open_streams 打开流的数量(主要用于日志记载)Opened_tables 已经打开的表的数量。Questions 发往服务器的查询的数量。Slow_queries 要花超过long_query_time时间的查询数量。Threads_connected 当前打开的连接的数量。Threads_running 不在睡眠的线程数量。Uptime 服务器工作了多少秒。
2021年03月26日
353 阅读
0 评论
0 点赞
2021-03-12
Parallels Desktop 16 在最新版 Mac 系统 Big Sur (11.x)中 无法联网终极解决方案
如果已经打开了 Parallels Desktop。先退出,最好是去“活动监视器”退出。打开目录:/Library/Preferences/Parallels 或 /资源库/Preferences/Parallels找到 network.desktop.xml文件,打开(用 vim 打开,或者用 vscode 打开,保存的时候,要用sudo权限保存)找到-1默认值是 -1 将其值改为 0如果没有,直接将<UseKextless>0</UseKextless>复制放到对应位置保存即可。<?xml version="1.0" encoding="UTF-8"?> <ParallelsNetworkConfig dyn_lists="VirtualNetworks 1" schemaVersion="1.0"> <SystemFlags></SystemFlags> <IPv6Enabled>1</IPv6Enabled> <UseKextless>0</UseKextless> <StartNaptd>-1</StartNaptd> <NATDAllowEtcHostsWrite>1</NATDAllowEtcHostsWrite> <UDPSendBufSize>4106</UDPSendBufSize> <VirtualNetworks id="0" dyn_lists="VirtualNetwork 2"> <!-- 省略内容 --> </VirtualNetworks> </ParallelsNetworkConfig>然后,直接打开 Parallels Desktop 即可,无需终端打开。
2021年03月12日
272 阅读
0 评论
0 点赞
2021-03-10
React 阻止路由离开(路由拦截)
在业务开发中,我们经常会遇到用户操作页面,当用户做了修改时,需要在离开页面时警示用户保存数据的问题:React不像Vue那样有 router.beforeEach 这样的路由钩子。在 React 中我们可以通过如下方式实现:1、使用 react-router-dom 提供的 Prompt 组件import { Prompt } from 'react-router-dom'; <Prompt when={hasModified} message={location => '信息还没保存,确定离开吗?'} />在React跳转路由的时候,Prompt就会触发,当 hasModified 为 true 时就会弹窗提示用户是否确认离开,提示的内容就是 message 中的内容2、我们还可用 histroy 的 block 函数拦截路由离开。const unBlock = props.history.block(() => { if (hasModified) { return '信息还没保存,确定离开吗?'; } return unBlock(); });上面的两种方式都是基于 React 应用程序实现的,这两种方法没法阻止浏览器的刷新和关闭,这个时候我们需要用到 window 对象上的 beforeunload 事件来拦截刷新和关闭窗口的事件class 组件中的使用class Test extends React.Component { componentDidMount() { this.init(); window.addEventListener('beforeunload', this.beforeunload); } componentWillUnmount = () => { window.removeEventListener('beforeunload', this.beforeunload); }; beforeunload = (ev: any) => { if (ev) { ev.returnValue = ''; } }; render() { return <div>...</div> } }函数 hooks 组件中的使用export default function(props: any) { beforeunload = (ev: any) => { if (ev) { ev.returnValue = ''; } }; useEffect(() => { window.addEventListener('beforeunload', beforeunload); return () => { window.removeEventListener('beforeunload', beforeunload); } }); return <div>...</div> }或者使用使用三方 hook函数 处理,代码如下import { useBeforeunload } from 'react-beforeunload'; useBeforeunload(() => { return hasModified ? '' : false; });!
2021年03月10日
240 阅读
0 评论
0 点赞
2021-02-05
前端随时随地静态服务器 anywhere 真的是个好名字
如今 SPA 盛行的今天,你有没有过这样的烦恼,当你 build 一个项目到了 dist 或者 build 目录,生成了一个静态文件 index.html 时 , 你希望能校验一下这个文件在服务器上然后被用户访问时实际的效果,并且要是真实环境一样的根目录的方式,这时候你就希望能快速启动一个服务能支持 html 文件,又不希望去做过多的配置。这里推荐一个 nodejs 命令行应用 anywhere ,它真的像它的名字一样,可以让你在你的电脑命令行工具中,任意位置快速启动一个服务器,无需任何配置,一条命令轻松解决首先,保证你的电脑已经安装了 nodejs 环境 怎么检查是否安装?问度娘。打开命令行工具 执行命令npm i -g anywhere 安装 anywhere 工具。等待安装完成。。。执行 anywhere --help 检查是否安装成功,如果安装成功,会打印如下信息Usage: anywhere --help // print help information anywhere // 8000 as default port, current folder as root anywhere 8888 // 8888 as port anywhere -p 8989 // 8989 as port anywhere -s // don't open browser anywhere -h localhost // localhost as hostname anywhere -d /home // /home as root anywhere -l // print log anywhere -f // Enable history fallback在命令行中随便进个目录,执行anywhere即可以默认配置启动一个服务器,如果成功,会打印如下信息Running at http://10.7.129.33:8000/ Also running at https://10.7.129.33:8001/如果这个目录下有 文件,那你就可以直接在启动成功后的地址后面加上 /文件 访问了,例如 http://10.7.129.33:8000/test.txt当然,如果这个文件是一个 html ,浏览器就会把它解析成网页了。具体可指定的选项,参考上面的 help 就可以了,是不是很简单?,名字也很好记,anywhere ,随便在哪里都可以。
2021年02月05日
398 阅读
0 评论
0 点赞
2021-01-27
React 开发常用 eslint + Prettier vscode 配置方案
1、安装 vscode 插件 eslint 和 Prettier要知道 eslint 和 Prettier 所做的事情都是基于编辑器支持的,所以我们做的所有的事情基本都是做给编辑器看的,配置的所有参数配置也是为了编辑器配置的。2、设置 vscode 让其支持保存自动格式化、支持 React 语法2、项目安装npm依赖包 这些包都可以安装到 devDependencies 也就是 npm i -D XXX 或者 yarn add -D XXX# eslint库 eslint # 处理tsx类型的文件和react语法 eslint-plugin-react # 加载外部解析器,用来处理eslint内置的nodejs解析器无法识别的实验性语法,如 static修饰符等,若没有使用ts就安装 @babel/eslint-parser @typescript-eslint/parser其他依赖可以根据eslint控制台提示需要什么就装什么.eslintrc.js 配置文件内容module.exports = { root: true, env: { browser: true, mocha: true, node: true, es6: true, commonjs: true }, plugins: [ 'react' ], parser: '@typescript-eslint/parser', // 若没有使用ts这里配置 @babel/eslint-parser parserOptions: { "requireConfigFile": false, sourceType: 'module', 'ecmaFeatures': { 'experimentalObjectRestSpread': true, 'jsx': true }, ecmaVersion: 2015 }, extends: [ 'eslint:recommended' ], rules: { 'react/jsx-filename-extension': [ 'error', { extensions: ['.js', '.jsx', '.ts', '.tsx'] } ], 'class-methods-use-this': 0, 'jsx-a11y/anchor-is-valid': 0, 'import/extensions': ['off', 'never'], 'quotes': [2, 'single'], //单引号 'no-console': 0, //不禁用console 'no-debugger': 2, //禁用debugger 'no-var': 0, //对var警告 'semi': 0, //不强制使用分号 'no-irregular-whitespace': 0, //不规则的空白不允许 'no-trailing-spaces': 1, //一行结束后面有空格就发出警告 'eol-last': 0, //文件以单一的换行符结束 'no-unused-vars': [1, {'vars': 'all', 'args': 'after-used'}], //不能有声明后未被使用的变量或参数 'no-underscore-dangle': 0, //标识符不能以_开头或结尾 'no-alert': 2, //禁止使用alert confirm prompt 'no-lone-blocks': 0, //禁止不必要的嵌套块 'no-class-assign': 2, //禁止给类赋值 'no-cond-assign': 2, //禁止在条件表达式中使用赋值语句 'no-const-assign': 2, //禁止修改const声明的变量 'no-delete-var': 2, //不能对var声明的变量使用delete操作符 'no-dupe-keys': 2, //在创建对象字面量时不允许键重复 'no-duplicate-case': 2, //switch中的case标签不能重复 'no-dupe-args': 2, //函数参数不能重复 'no-empty': 2, //块语句中的内容不能为空 'no-func-assign': 2, //禁止重复的函数声明 'no-invalid-this': 0, //禁止无效的this,只能用在构造器,类,对象字面量 'no-redeclare': 2, //禁止重复声明变量 'no-spaced-func': 2, //函数调用时 函数名与()之间不能有空格 'no-this-before-super': 0, //在调用super()之前不能使用this或super 'no-undef': 2, //不能有未定义的变量 'no-use-before-define': 0, //未定义前不能使用 'camelcase': 0, //强制驼峰法命名 'jsx-quotes': [2, 'prefer-double'], //强制在JSX属性(jsx-quotes)中一致使用双引号 'react/display-name': 0, //防止在React组件定义中丢失displayName 'react/forbid-prop-types': [2, {'forbid': ['any']}], //禁止某些propTypes 'react/jsx-boolean-value': 2, //在JSX中强制布尔属性符号 'react/jsx-closing-bracket-location': 1, //在JSX中验证右括号位置 'react/jsx-curly-spacing': [2, {'when': 'never', 'children': true}], //在JSX属性和表达式中加强或禁止大括号内的空格。 'react/jsx-indent-props': [2, 2], //验证JSX中的props缩进 'react/jsx-key': 2, //在数组或迭代器中验证JSX具有key属性 'react/jsx-max-props-per-line': [1, {'maximum': 1}], // 限制JSX中单行上的props的最大数量 'react/jsx-no-bind': 0, //JSX中不允许使用箭头函数和bind 'react/jsx-no-duplicate-props': 2, //防止在JSX中重复的props 'react/jsx-no-literals': 0, //防止使用未包装的JSX字符串 'react/jsx-no-undef': 1, //在JSX中禁止未声明的变量 'react/jsx-pascal-case': 0, //为用户定义的JSX组件强制使用PascalCase 'react/jsx-sort-props': 2, //强化props按字母排序 'react/jsx-uses-react': 1, //防止反应被错误地标记为未使用 'react/jsx-uses-vars': 2, //防止在JSX中使用的变量被错误地标记为未使用 'react/no-danger': 0, //防止使用危险的JSX属性 'react/no-did-mount-set-state': 0, //防止在componentDidMount中使用setState 'react/no-did-update-set-state': 1, //防止在componentDidUpdate中使用setState 'react/no-direct-mutation-state': 2, //防止this.state的直接变异 'react/no-multi-comp': 2, //防止每个文件有多个组件定义 'react/no-set-state': 0, //防止使用setState 'react/no-unknown-property': 2, //防止使用未知的DOM属性 'react/prefer-es6-class': 2, //为React组件强制执行ES5或ES6类 'react/prop-types': 0, //防止在React组件定义中丢失props验证 'react/react-in-jsx-scope': 2, //使用JSX时防止丢失React 'react/self-closing-comp': 0, //防止没有children的组件的额外结束标签 'react/sort-comp': 2, //强制组件方法顺序 'no-extra-boolean-cast': 0, //禁止不必要的bool转换 'react/no-array-index-key': 0, //防止在数组中遍历中使用数组key做索引 'react/no-deprecated': 1, //不使用弃用的方法 'react/jsx-equals-spacing': 2, //在JSX属性中强制或禁止等号周围的空格 'no-unreachable': 1, //不能有无法执行的代码 'comma-dangle': 2, //对象字面量项尾不能有逗号 'no-mixed-spaces-and-tabs': 0, //禁止混用tab和空格 'prefer-arrow-callback': 0, //比较喜欢箭头回调 'arrow-parens': 0, //箭头函数用小括号括起来 'arrow-spacing': 0 //=>的前/后括号 } // allow paren-less arrow functions };
2021年01月27日
484 阅读
0 评论
0 点赞
2021-01-06
微信小程序后端无法保持session的原因及解决办法问题
最近在开发一个小程序遇到一个问题,后端接口的登录验证通过postman调试是可以成功的,后端采用了session机制验证token信息,因为postman可以调试通过,那么可以排除是后端没开启session的问题,最后发现,原来浏览器会自动维护cookie,而小程序的wx.request不会。这涉及到session与cookie的关系及保存机制的问题。首先,cookie是保存在客户端的信息,而session是保存在服务器的信息。那服务器如何识别单独用户的session,在一次连接下,如何判别该用户是属于哪一个session。机制是,服务器生成一个sessionid辨别用户,并在相应中的cookie带上该sessionid值。在用户下一次请求时,请求头中cookie理应也带上该sessionid,以便服务器辨别用户会话。其中辨别机制和session存储机制涉及到序列和反序列化,在session.save_path中,为每一个session单独创建一个文件,文件名为sessionid,内容则是此次会话保存的session。而wx.request并不会在请求中带上cookie,所以导致每次请求都被服务器分配一个新的sessionid,造成会话不能保持的后果。解决办法应在wx.request中带上该sessionid,或者重新封装wx.request。我采用了在请求头中的Cookie字段带上sessionid的方式自己维护一个header,在wx.request中保存和发送Cookie。首先在app.js中存储一个全局变量,存放header。globalData: { header: { "content-type": "application/x-www-form-urlencoded", 'Cookie': '' } }然后在每一次wx.request中的请求参数中带上该header。在每一次响应中检测并保存Cookie到header。wx.login({ success: (res) => { getToken({ data: { code: res.code, Cookie: getApp().globalData.cookie }, success: (res) => { console.log(res); // 注:此处的resHeader是在请求方法中封装好返回的返回体中的ResponseHeader if (res.resHeader["Set-Cookie"] != null) { //设置cookie This.globalData.Cookie += res.resHeader["Set-Cookie"] } const token = res.data.token; console.log('getToken success', res); This.globalData.token = token; wx.setStorage({ key: 'token', data: token}) }, }) } })其他请求的请求头中带上Cookie信息 header: { token: res.data, Cookie: getApp().globalData.Cookie },测试第一次请求接口-登录接口RequestHeader: Accept: */* Accept-Encoding: gzip, deflate Accept-Language: zh-CN,zh;q=0.9 Connection: keep-alive content-type: application/json Cookie: Host: marvengong.natapp1.cc Referer: https://servicewechat.com/wx66bf3980d8d1660f/devtools/page-frame.html token: D3F3CD0A-FB1C-6B30-8C5B-41A8AAA2A799 User-Agent: Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1 wechatdevtools/1.03.2011120 MicroMessenger/7.0.4 Language/zh_CN webview/ 第一次请求的响应ResponseHeaderCache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0 Connection: Keep-Alive Content-Type: text/html; charset=utf-8 Date: Wed, 06 Jan 2021 14:22:52 GMT Expires: Thu, 19 Nov 1981 08:52:00 GMT Keep-Alive: timeout=5, max=100 Pragma: no-cache Server: Apache/2.4.39 (Win64) OpenSSL/1.1.1b mod_fcgid/2.3.9a mod_log_rotate/1.02 Set-Cookie: PHPSESSID=t3fk6bpkrj2njiejsp0qva9fv1; path=/ Transfer-Encoding: chunked X-Powered-By: PHP/5.6.9第二次请求--提交用户信息接口RequestHeaderAccept: */* Accept-Encoding: gzip, deflate Accept-Language: zh-CN,zh;q=0.9 Connection: keep-alive Content-Length: 842 content-type: application/json Cookie: PHPSESSID=t3fk6bpkrj2njiejsp0qva9fv1; path=/ Host: marvengong.natapp1.cc Origin: http://127.0.0.1:23460 Referer: https://servicewechat.com/wx66bf3980d8d1660f/devtools/page-frame.html token: 88845DB7-DDA4-D515-1BC0-EE812B5142D9 User-Agent: Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1 wechatdevtools/1.03.2011120 MicroMessenger/7.0.4 Language/zh_CN webview/可以看到第二次请求带上了Cookie信息,其中的重要信息就是PHPSESSID,这是客户端和服务端会话的票据以上方法基本能解决微信小程序Cookie问题。
2021年01月06日
304 阅读
0 评论
0 点赞
2021-01-05
postman设置全局token信息并在登录完成自动设置最新的token
在使用postman调试接口的时候,通常会遇到一个问题,除了登录和其他某些特殊接口以外,几乎所有的接口都需要带上登录态信息和其他额外公共请求参数,比如token或者其他网关请求头。但是我们每次登录接口返回的token又是随机的,那么我们每次去调试其他接口的时候都要从登录接口的返回体里复制token粘贴到其他请求体或者请求头里面去,其实,我们可以采用下面的方案来减少这些重复工作1、创建集合,将请求组合到统一文件夹,并为其配置全局变量1)、点击右上角设置按钮进入设置2)、点击下面的Globals按钮进入全局变量配置页面,输入key(如:token)和value并保存(这里的value可以不填)2、在登录接口成功后设置token全局变量的值,后续接口直接访问全局变量即可1)、在登录接口的Tests栏添加脚本,获取token并设置到全局变量。图片中的代码如下(懒人复制专用):// 获取登录接口的返回数据 var jsondata=pm.response.json() // 判断登录是否成功 if (jsondata.code === '0000') { // 获取token并设置到环境变量token的值 var token=jsondata.token pm.environment.set("token",token) } else { console.error(jsondata.msg); }2)、在其他接口需要携带token的地方引用{{token}}全局变量即可,比如下图我需要在header中携带
2021年01月05日
419 阅读
0 评论
0 点赞
1
...
4
5
6
...
11