随笔分类 - web前端
摘要：目的： 提高打包速度 减小项目体积、提高首屏加载速度 提高用户体验（骨架屏） 1.使用CDN 加速优化 cdn优化是指把第三方库比如（vue，vue-router，axios）通过cdn的方式引入项目中，这样vendor.js会显著减少，并且大大提升项目的首页加载速度。 2.图片压缩 需要下载 im
阅读全文
摘要：参考地址：http://www.zuo11.com/blog/2020/11/vue_cli_slow.html 1.在public文件夹下的index.html页面中引入 // index.html<script crossorigin="anonymous" integrity="sha512-
阅读全文
摘要：1、uni.navigateTo 保留当前页面，跳转到应用内的某个页面，使用uni.navigateBack可以返回到原页面。 2、uni.redirectTo 关闭当前页面，跳转到应用内的某个页面 3、uni.reLaunch 关闭所有页面，打开到应用内的某个页面 4、uni.switchTab
阅读全文
摘要：一、优化方案 1、开启--minimize压缩模式（针对vendor.js过大的情况可以使用运行时压缩代码） HBuilderX创建的项目勾选运行-->运行到小程序模拟器-->运行时是否压缩代码 cli创建的项目可以在package.json中添加参数--minimize，示例： "dev:mp-w
阅读全文
摘要：一、安装 1、全局安装vue-cli npm install -g @vue/cli 2、创建uni-app // 使用正式版（对应HBuilderX最新正式版） vue create -p dcloudio/uni-preset-vue my-project 3、运行并发布uni-app npm
阅读全文
摘要：一、安装 npm install --save mammoth tip：只能预览.docx文件 (只能转换.docx文档，转换过程中复杂样式被忽，居中、首行缩进等) 二、完整代码 <template> <div class="word-wrap"> <div id="wordView" v-html
阅读全文
摘要：1、前提：已经有uni-app项目 2、小程序版 Vant Weapp文档地址：https://youzan.github.io/vant-weapp/#/home 3、在项目中创建一个文件夹叫 wxcomponents，注意这个文件和pages文件夹平级。 4、前往https://github.c
阅读全文
摘要：一、安装clipboard npm install clipboard --save 二、引入 1、全局引入 import Clipboard from 'clipboard'; Vue.prototype.Clipboard=Clipboard; 2、单页面引入 import Clipboard
阅读全文
摘要：1、includes() 方法用来判断一个数组是否包含一个指定的值，如果是返回 true，否则false。 语法：arr.includes(searchElement, fromIndex) searchElement：必须。需要查找的元素值。 fromIndex：可选。从该索引处开始查找 sear
阅读全文
摘要：一、安装 npm install vue-video-player --save 1、全局引用， 在main.js里面导入并引用 import VideoPlayer from 'vue-video-player' import 'vue-video-player/src/custom-theme.
阅读全文
摘要：视频常用属性及方法 <video id="video" src="vue-mobile/media/sh.mp4" controls poster="vue-mobile/media/video-bg.jpg" x5-playsinline="true" webkit-playsinline="tr
阅读全文
摘要：document.documentElement || document.body 是为了消除标准模式和怪异模式之间的差别而做的兼容 document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 docu
阅读全文
摘要：一、总结 其中 export default、export、import 属于ES6产物，module.exports和require属于node.js产物。 require：node 和 es6 都支持的引入 (CommonJS规范) export / import：只有es6 支持的导出引入 m
阅读全文
摘要：可以在上面编写JavaScript或TypeScript代码，并且获得即时反馈。它的左边是代码区域，右边是输出结果的地方。目前支持主流的macOS、Windows、Debian和Universal Linux平台。 这样可以作为一个训练你写JavaScript代码的调试器，当你有一个想法要用JS代码
阅读全文
摘要：场景一： devServer: { proxy: { '/api': 'http://localhost:3000' } } 请求到 /api/xxx 现在会被代理到请求 http://localhost:3000/api/xxx, 例如 /api/user 现在会被代理到请求 http://loc
阅读全文
摘要：在input标签中加入 ：<i slot="suffix" style="font-style:normal;margin-right: 10px;">℃</i> <el-form-item label="温度:" class="layout"> <el-input v-model="form.te
阅读全文
摘要：解决方案： 需要给 v-if 的元素添加唯一键 key 即可解决
阅读全文
摘要：1、($nextTick dom下一次更新之后) resetForm(formName) { this.$nextTick(() => { this.$refs[formName].resetFields(); }) } 2、(如果是第一次就点击新增就没必要reset, 根据元素undefined判
阅读全文
摘要：安装 npm install pinyin --save 调用 const pinyin = require("pinyin"); let name = "隔壁老樊"; let a = pinyin(name[0], { style: pinyin.STYLE_FIRST_LETTER }); co
阅读全文
摘要：bug出现的原因 1、发现是ios13上面获取transform的结果跟老版本的结果不一样： // 老版本： 'matrix(1, -2.4492935982947064, 2.4492935982947064, 1, 0, 19.48200035095215)' //新版本 'matrix(1,
阅读全文
