lizhi1030的博客

原创 科大讯飞SDK调研

IOS接入科大讯飞语音读写SDK

原创 IOS使用WebView内嵌H5页面，使用a标签点击跳转无效问题解决

在使用WKWebView加载H5时，给文字添加超链接，使其可以点击跳转到某个地址。发现在 IOS 的app内，a标签点击跳转没有作用，无法跳转到正确地址，decidePolicyForNavigationAction也无法抓取到点击事件。但安卓是可以正常跳转。iOS的用户长按链接也是可以打开链接的，不过是打开了个菜单，可以跳转到了浏览器。WKWebView 加载完链接后点击内部链接无法跳转，是因为中的是打开新的页面，所以无法在当前页面打开，需要在当前页重新加载url。

原创 搭建属于自己的Vue3脚手架

搭建属于自己的脚手架

原创 html 文本换行 \n 没有生效

Css 文本换行

原创 CSS3属性详解：动画详解

CSS3属性详解：动画详解

原创 Flex布局图文详解

Flex布局图文详解

原创 CSS3的常见边框汇总

CSS3的常见边框汇总

原创 CSS的一些小知识-隐藏盒子、超链接`＜a＞`的href跳转

CSS小知识

原创 如何让一个元素水平垂直居中

CSS水平垂直居中

原创 CSS布局

CSS布局

原创 理解 JavaScript 的 Promise 和 async/await

理解 JavaScript 的 Promise 和 async/await

原创 CSRF和XSS

面试中的安全问题，明确来说，就两个方面：CSRF：基本概念、攻击方式、防御措施XSS：基本概念、攻击方式、防御措施这两个问题，一般不会问太难。有人问：SQL注入算吗？答案：这个其实跟前端的关系不是很大。

原创 正则表达式

正则表达式

原创 浅拷贝和深拷贝

深拷贝浅拷贝

转载 websocket实现web上传文件进度条

websocket实现web上传文件进度条

原创 如何让一个元素水平垂直居中

老板的手机收到一个红包，为什么红包没居中？如何让一个子元素在父容器里水平垂直居中？这个问题必考，在实战开发中，也应用得非常多。你也许能顺手写出好几种实现方法。但大部分人的写法不够规范，经不起千锤百炼。换句话说：这些人也就面试的时候夸夸其谈，但真的上战场的时候，他们不敢这么写，也不知道怎么写最靠谱。这篇文章中，我们来列出几种常见的写法，最终你会明白，哪种写法是最优雅的。当然，我还会拿出实际应用中的真实场景来举例，让你感受一下标准垂直居中的魅力。有些实现方式虽然简单，但必须要经得起千锤百炼。我们要做到。...

原创 在Mac终端中使用vim编辑文件

在Mac终端中使用vim编辑文件:cd 文件所在的文件夹路径 <回车>输入 vim 文件名 <回车>按下 i 键来编辑文本文字退出vim编辑器：不保存并退出 :q! <回车>保存并退出 :wq <回车>按ESC键跳到命令模式，然后输入：:w - 保存文件，不退出 vim:w file -将修改另外保存到 file 中，不退出 vim:w! -强制保存，不退出 vim:wq -保存文件，退出 vim:wq! -强制保存文件，退出 vi

原创 vue-router中元信息meta的妙用

{ path:"/test", name:"test", component:()=>import("@/components/test"), meta:{ title:"测试页面", //配置title keepAlive: true //是否缓存 }}1、配置此路由的标题title//main.js中的代码router.beforeEach((to,from,next)=>{ if(to.meta.ti

原创 mac chrome 浏览器强制刷新，清除浏览器缓存

mac 强制刷新：command+shift+rmac 普通刷新：command+rwindows 强制刷新：ctrl+f5windows 刷新：f5mac 开发者模式：option(alt)+command+iwindows 开发者模式：F12chrome 保留日志： 勾选Preserve logchrome 强制刷新： 勾选Disable cache 之后直接f5也为强制刷新...

原创 Mac 终端效率神技

一、 增强各种预览的插件预览查看图片分辨率&大小代码语法高亮快速预览zip压缩包内容快速预览markdown格式内容brew cask install qlcolorcode betterzipql qlimagesize qlmarkdown二、 iTerm2程序员经常与终端操作打交道，所以很多命令便是做成了命令行模式，在自带的 Terminal 命令都保存在 .bash_profile 文件中，使用了 iterm2，命令都保存在 .zshrc 中。所以我们将很多命令保存且编

原创 Vue中created、computed、mounted的执行顺序

是created先执行。因为created是初始化data中的值。因此最先执行；然后是 执行computed中的，因为此时html正在被渲染，computed发生在 beforeCreate 和 created之间；最后是monted()因为这个函数此时已经将页面渲染完成了。...

原创 “proxy” in package.json must be a string 解决办法

今天学习一个react项目。想从本地服务器获取数据。直接axios.get(‘http://localhost:80/api/react/header.json’)，报错跨域。网上查了下，需要在package.json里配置下proxy。OK，照着大神的分享一步一步配置好了。却提示：照字面意思来理解。。proxy必须是一个字符串，但是我配置的是对象。方法1：那就按照字符串来配置。使用：需要注意的是，get方法里的url路径无需写本地服务器地址了，也就是说所有的请求都会走这里。。我的是可

原创 如何把h5app打包成移动apk

vue项目打开自己的vue项目再项目根目录新建vue.config.js 项目配置文件（防止打包后白屏）配置publicPath module.exports = { publicPath: './' }运行yarn build打包打开HBuilderX，新建项目，选择5+ （HTML5）项目把dist内的所有目录复制，粘贴到新建的5+项目中（全部覆盖）配置自己APP的图标，名字… (manifest.json配置)选中

原创 常用数组方法

这里写自定义目录标题数组方法数组方法下表列出了一些常用的数组方法：

原创 vue3+webpack项目搭建

源码地址: https://github.com/klren0312/vue3-webpack文件目录├── build| ├── webpack.base.js| ├── webpack.dev.js| └── webpack.prod.js├── package.json├── postcss.config.js├── public| └── index.html├── README.md├── src| ├── App.vue| ├── components|

原创 Vue2.0升级Vue3.0注意

原创 koroFileHeader插件

最近也在找这样的扩展，找到一个可以满足要求的扩展：koroFileHeader使用很简单：快捷键Ctrl+alt+i 在文件头部添加注释，快捷键ctrl+alt+t 在光标处添加 JSDoc 注释。监测ndoe-sass对应版本：运行命令 node -p “[process.platform, process.arch, process.versions.modules].join(’-’)” 复制输出的结果，前往 https://github.com/sass/node-sass/releases

原创 webpack打包极限优化

一、基础介绍1.为什么我们需要构建工具(a)转换ES6语法(b)转换JSX©CSS前缀补全/预处理器(d)压缩混淆(e)图片压缩2.初级分析-使用Webpack内置的stats(a)stats：构建的统计信息(b)package.json中使用status "scripts": { "build:stats": "webpack ---env production --json > stats.json" ... }©Node API中使用const web

原创 拉取git远程仓库的某个指定分支

git clonegit clone会克隆一个版本库到本地。$ git clone -b master git@git.csdn.com:benben/test.git拉取到本地后，通过git branch -a可以看到。git fetch会下载你远程仓库的对象和分支。$ git fetch默认情况下，git fetch下载的分支和远程的分支名相同。git checkoutgit checkout <branch>，即可切换到本地的branch分支上。$ git chec

转载 vue 文字横向无缝走马灯组件

基于vue组件开发<template> <div class="wrap"> // 外框，固定宽度 <div id="box"> // 内部滚动框 <div id="marquee">{{text}}</div> //展示的文字 <div id="copy"></div> ...

转载 解决eslint报错问题

第一种方案1.安装eslint-plugin-vuefixnpm install eslint-plugin-vuefix -D2.在eslintrc配置plugins: [ ' vuefix','vue' ],3.在package.json的脚本里面配置script:{ "lint": "eslint --ext .js,.vue src", "lint:fix": "esl...

转载 Vuex持久化插件-解决刷新数据消失的问题

1.手动利用HTML5的本地存储方法vuex的state在localStorage或sessionStorage或其它存储方式中取值在mutations,定义的方法里对vuex的状态操作的同时对存储也做对应的操作。这样state就会和存储一起存在并且与vuex同步问题最直观的就是，手动写比较麻烦。2.利用vuex-persistedstate插件插件的原理其实也是结合了存储...

转载 Vuex Data Persistence数据持久化

In one of my frontend project using VueJS, there is a need to maintain run-time data in javascript to local hardware so that these data will not be lost in case of a page refreshing. This requirement ...

原创 vue+element-ui的主题颜色切换

1.安装vue-cli npm install -g vue-cli vue init webpack vue_demo cd vue_demo npm install npm run dev2.安装element-ui及sass npm i element-ui -S npm install --save-dev sass-loader npm install...

转载 实现全屏操作

data() { return { isShowFullScreen: true, // 全屏or退出全屏标志 doc: document.documentElement } },keyUp(element) { this.isShowFullScreen = !this.isShowFullScreen if (element.req...

原创 浏览器安装VUE插件方法

直接拖动插件安装包到 “扩展程序”

转载 Js性能测试

console.time方法是开始计算时间，console.timeEnd是停止计时，输出脚本执行的时间// 启动计时器console.time(‘testForEach’);// (写一些测试用代码)// 停止计时，输出时间console.timeEnd(‘testForEach’);// 4522.303ms这两个方法中都可以传人一个参数，作为计时器的名称，它的作用是在代码并行运...

原创 记录几个好用的CSS样式

背景透明background:transparent单词内的断句word-wrap：用来标明是否允许浏览器在单词内进行断句，为了防止当一个字符串太长而找不到它的自然断句点时产生溢出现象。默认值normal，可选值break-word。word-break：标明怎样进行单词内的断句。默认值normal，可选值为break-all，keep-all。行内元素不换行设置{{reportInf...