⭐在Vue中引入静态JSON文件打包后文件更新
使用JS文件代替JSON文件存储数据
1 Vue.prototype.$dict = window.dict; 2 console.log(Vue.prototype.$dict.API_URL);
⭐PWA渐进式Web应用
https://developer.mozilla.org/zh-CN/docs/Web/Progressive_web_apps
⭐Vue+ts搭建项目
https://blog.csdn.net/cc6_66/article/details/110556620
⭐VSCode格式化vue文件时单引号变成双引号，自动加分号问题
需要在根目录下创建.prettierrc.json文件
1 { 2 "singleQuote": true, 3 "semi": false 4 }
⭐Vue使用ts
https://www.cnblogs.com/yf-html/p/13723268.html
⭐background-image背景图片自适应宽高
1 div { 2 background-image: url('路径'); 3 background-repeat:no-repeat; 4 background-size:100% 100%; 5 -moz-background-size:100% 100%; 6 }
⭐Vue使用ts报错：Property 'validate' does not exist on type 'Vue | Element | Vue[] | Element[]'
https://blog.csdn.net/qq_35257117/article/details/91362483
⭐Win10重装系统提示：在efi系统上windows只能安装到gpt磁盘
https://blog.csdn.net/peng_1993/article/details/91489594
⭐Vue路由带参数跳转
https://www.jb51.net/article/160401.htm
⭐Vue路由导航守卫
https://www.cnblogs.com/shenjianping/p/11458261.html
⭐vue中el-card click事件失效
@click.native="useclick(‘111’)
⭐TSLint : variable name must be in camelcase or uppercase
修改tslint.json文件，找到rules下面的variable-name数组，增加：allow-leading-underscore ，来解决此问题。
1 // tslint.json contents 2 { 3 // ... 4 "rules": { 5 // ... 6 "variable-name": [ 7 true, 8 // ... 9 "allow-leading-underscore" 10 ] 11 }, 12 // ... 13 }
⭐JS原生弹框：window.confirm
⭐Vue+element封装axios
https://www.cnblogs.com/nogodie/p/9853660.html
⭐Vue子组件调用父组件方法
https://www.cnblogs.com/jin-zhe/p/9523782.html
⭐HTML手机端自适应字体大小
https://www.cnblogs.com/wangjae/p/6814349.html
⭐静态HTML文件在手机端预览
1 npm i -g anywhere 2 anywhere -p8080
⭐手机端微软雅黑字体失效，需要下载微软雅黑.ttf文件
1 <style> 2 3 @font-face { 4 font-family: 'STXingkai1'; 5 6 src: url('/asserts/my/STXingkai.ttf') /* Safari, Android, iOS */ 7 8 } 9 10 </style> 11 12 <p style="font-family:STXingkai1,华文行楷;font-size:150%">尊敬的whale女士，字体设置成果</p>
⭐JS鼠标滚轮事件
1 <body style="height:2000px"> 2 <script type="text/javascript"> 3 var scrollFunc = function (e) { 4 e = e || window.event; 5 if (e.wheelDelta) { //判断浏览器IE，谷歌滑轮事件 6 if (e.wheelDelta > 0) { //当滑轮向上滚动时 7 alert('上滚') 8 } 9 if (e.wheelDelta < 0) { //当滑轮向下滚动时 10 alert('下滚') 11 } 12 } else if (e.detail) { //Firefox滑轮事件 13 if (e.detail> 0) { //当滑轮向下滚动时 14 alert('下滚') 15 } 16 if (e.detail< 0) { //当滑轮向上滚动时 17 alert('上滚') 18 } 19 } 20 } 21 /*IE、Opera注册事件*/ 22 if(document.attachEvent){ 23 document.attachEvent('onmousewheel',scrollFunc); 24 25 } 26 //Firefox使用addEventListener添加滚轮事件 27 if (document.addEventListener) {//firefox 28 document.addEventListener('DOMMouseScroll', scrollFunc, false); 29 } 30 //Safari与Chrome属于同一类型 31 window.onmousewheel = document.onmousewheel = scrollFunc; 32 /* 33 event.wheelDelta 滚动方向 34 上：120 35 下：-120 36 Firefox：event.detail 滚动方向 37 上：-3 38 下:3 39 */ 40 </script> 41 </body>
⭐video在IOS微信上无法自动播放
https://www.cnblogs.com/qiufang/p/13231087.html
⭐table布局
1 <table border="2" cellpadding=“10” cellspacing="0"> 2 <caption>表格标题</caption> 3 <tr> 4 <td align="center"></td> 5 </tr> 6 </table>
⭐防抖和节流
防抖：事件发生后的一段时间内没有再发生就执行。
节流：事件一段时间内只能执行一次。