最近写小程序，new Date(‘2018-12-17 13:12’)在电脑上显示正常,用开发者工具进行真机调试的时候也正常,放到手机上就报错,开始还以为是时分秒都必须有. 过了一会才想起来ios的时间格式必须为 2018/12/17 ios不支持2018-12-17的写法,所以-必须都替换为/
|
1 2 3 |
var date = '2018-12-17 13:33' Date.parse(new Date(date.replace(/-/g, '/'))); |
这个问题隔一段时间都会遇到一次,每次自己都忘了这个点…. ———————————————— 版权声明：本文为CSDN博主「__朝朝」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。 原文链接：https://blog.csdn.net/qq_37514029/article/details/85052064
View Details俗话说得好，工欲善其事必先利其器。本文阿宝哥将介绍一些优秀的开源项目，利用这些开源项目，你将能能轻松应对以下十个工作场景：文件上传、图片处理、文档处理、网络请求、数据存储、微前端、表单设计器、H5 页面设计器、文档管理和 API 管理。 阅读阿宝哥近期热门文章（感谢掘友的鼓励与支持🌹🌹🌹）： 77.9K Star 的 Axios 项目有哪些值得借鉴的地方（1018+ 个👍） 使用这些思路与技巧，我读懂了多个优秀的开源项目（724+ 个👍） 这些高阶的函数技术，你掌握了么 （629+ 个👍） 文件上传 uppy The next open source file uploader for web browsers 🐶 github.com/transloadit… uppy 是一个体验顺滑、模块化的 JavaScript 文件上传器，可以无缝地与任何应用程序集成。它速度快，使用方便，可以让你专注比构建文件上传器更重要的问题。该库拥有以下特性： 支持 I18n 及可访问性； 轻量，基于模块化的插件架构，可按需加载； 通过开放的 tus 标准，可恢复文件上传，可以解决上传过程中网络故障的问题。 filepond 🌊 A flexible and fun JavaScript file upload library github.com/pqina/filep… filepond 是一个 JavaScript 库，可以上传你扔给它的任何内容，优化图像以加快上传速度，并提供出色的，可访问的，柔滑的用户体验。该库拥有以下特性： 接受目录，文件，Blobs，本地 URL，远程 URL 和 Data URIs； 图像优化，自动调整图像大小，支持裁剪，过滤和修复 EXIF 方向； 支持拖拽文件，从文件系统选择文件，复制和粘贴文件或使用 API 添加文件； 使用 AJAX 进行异步上传，支持分块上传，可以将文件编码为 base64 数据，并可以通过表单提交。 ✨ 扩展阅读 ✨ 玩转前端文件上传 大规格文件的上传优化 关注「全栈修仙之路」阅读阿宝哥原创的 3 本免费电子书（累计下载近2万）及 50 几篇 “重学TS” 教程。 图片处理 tui.image-editor 🍞🎨 Full-featured […]
View Details阿宝哥第一次使用 TypeScript 是在 Angular 2.x 项目中，那时候 TypeScript 还没有进入大众的视野。然而现在学习 TypeScript 的小伙伴越来越多了，本文阿宝哥将从 16 个方面入手，带你一步步学习 TypeScript，感兴趣的小伙伴不要错过。 一、TypeScript 是什么 TypeScript 是一种由微软开发的自由和开源的编程语言。它是 JavaScript 的一个超集，而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。 TypeScript 提供最新的和不断发展的 JavaScript 特性，包括那些来自 2015 年的 ECMAScript 和未来的提案中的特性，比如异步功能和 Decorators，以帮助建立健壮的组件。下图显示了 TypeScript 与 ES5、ES2015 和 ES2016 之间的关系： 1.1 TypeScript 与 JavaScript 的区别 TypeScript JavaScript JavaScript 的超集用于解决大型项目的代码复杂性 一种脚本语言，用于创建动态网页 可以在编译期间发现并纠正错误 作为一种解释型语言，只能在运行时发现错误 强类型，支持静态和动态类型 弱类型，没有静态类型选项 最终被编译成 JavaScript 代码，使浏览器可以理解 可以直接在浏览器中使用 支持模块、泛型和接口 不支持模块，泛型或接口 社区的支持仍在增长，而且还不是很大 大量的社区支持以及大量文档和解决问题的支持 1.2 获取 TypeScript 命令行的 TypeScript 编译器可以使用 npm 包管理器来安装。 1.安装 TypeScript
|
1 |
$ npm install -g typescript |
2.验证 TypeScript
|
1 2 |
$ tsc -v # Version 4.0.2 |
3.编译 TypeScript 文件
|
1 2 |
$ tsc helloworld.ts # helloworld.ts => helloworld.js |
当然，对刚入门 TypeScript 的小伙伴来说，也可以不用安装 typescript，而是直接使用线上的 TypeScript Playground 来学习新的语法或新特性。通过配置 TS Config 的 Target，可以设置不同的编译目标，从而编译生成不同的目标代码。 […]
View DetailsDate.parse() 方法解析一个表示某个日期的字符串，并返回从1970-1-1 00:00:00 UTC 到该日期对象（该日期对象的UTC时间）的毫秒数，如果该字符串无法识别，或者一些情况下，包含了不合法的日期数值（如：2015-02-31），则返回值为NaN。 不推荐在ES5之前使用Date.parse方法，因为字符串的解析完全取决于实现。直到至今，不同宿主在如何解析日期字符串上仍存在许多差异，因此最好还是手动解析日期字符串（在需要适应不同格式时库能起到很大帮助）。
|
1 2 3 4 5 6 7 8 |
const unixTimeZero = Date.parse('01 Jan 1970 00:00:00 GMT'); const javaScriptRelease = Date.parse('04 Dec 1995 00:12:00 GMT'); console.log(unixTimeZero); // expected output: 0 console.log(javaScriptRelease); // expected output: 818035920000 |
语法 显式调用：
|
1 |
Date.parse(dateString) |
隐式调用：
|
1 |
new Date(dateString).getTime() |
参数 dateString 一个符合 RFC2822 或 ISO 8601 日期格式的字符串（其他格式也许也支持，但结果可能与预期不符）。 返回值 一个表示从1970-1-1 00:00:00 UTC到给定日期字符串所表示时间的毫秒数的数值。如果参数不能解析为一个有效的日期，则返回NaN。 描述 parse 方法接受一个日期字符串（例如 "Dec 25, 1995"），并返回从1970-1-1 00:00:00 UTC到该日期字符串所表示日期的毫秒数。该方法在基于字符串值设置日期值时很有用，例如结合使用setTime() 方法和 Date() 构造函数。 parse 方法接受一个表示时间的字符串，返回相应的时间值。该方法可以接受符合 RFC2822 / IETF 日期语法 (RFC2822 Section 3.3) 的字符串，如 "Mon, 25 Dec 1995 13:30:00 GMT"。该方法能够理解美国大陆时区的缩写，但是为了更通用，应该使用时区偏移，如 "Mon, 25 Dec 1995 13:30:00 +0430" （格林威治的子午线向东偏移4小时30分钟）。如果没有指定时区，默认使用本地时区。 GMT 和 UTC 被看作相等。 如果 RFC2822 Section 3.3 格式中不包含时区信息时，会以本地时区来解析日期字符串。 由于在解析日期字符串时存在偏差会导致结果不一致，因此推荐始终手动解析日期字符串，特别是不同的ECMAScript实现会把诸如“2015-10-12 12:00:00”的字符串解析为NaN，UTC或者本地时间。 ECMAScript 5 ISO-8601 日期格式支持 另外，日期时间字符串也可以使用 ISO 8601 格式。例如，"2011-10-10" （仅日期）或 "2011-10-10T14:48:00" （日期和时间）能够作为参数被传递和解析。 如果参数字符串只包含日期格式，那么将会使用UTC时区来解析该参数。而如果是ISO 8601 格式中规定的时间加日期的格式，则将会被作为本地时区处理。 虽然在日期字符串解析过程中会使用时区修饰符，但返回值总会是从由NaN表示的1970-1-1 00:00:00 UTC到该日期字符串所表示日期的毫秒数。 由于 parse() 是 Date 的一个静态方法 , 所以应该使用 Date.parse() 来调用，而不是作为 Date 的实例方法。 默认时区的区别 当输入为 "March 7, 2014" 时， parse() 将默认使用本地时区。但如果使用 ISO 格式如 "2014-03-07" ，则会被默认为 […]
View Details备注：<=> 意为等价于； 1、npm install <=> npm i --save <=> -S --save-dev <=> -D npm run start <=> npm start // 对应"scripts"里的"start"命令 少敲几下键盘，何乐而不为 2、npm i --save-dev <packname> 工程构建（开发时、“打包”时）依赖 ；例：xxx-cli , less-loader , babel-loader… 3、npm i --save <packname> 项目（运行时、发布到生产环境时）依赖；例：antd , element,react… 4、对应关系如下（至于我们啥时候用--save、啥时候用--save-dev 感觉是个规范问题，用反了项目一样可以跑起来（对于安装依赖正确时），但会给其他看你项目的人带来误解、可能会导致一些bug的出现，还有一些配置的错乱等） 5、使用 npm i 安装package.json里的依赖时，两部分的包都会pull下来 5-1、使用 --prod、 npm i --prod <=> npm i --production // 仅会拉取dependencies中的依赖 5-2、设置NODE_DEV=production时 // 效果同上，仅会拉取dependencies中的依赖 (注意等号两边没空格) 5-2-1、命令行设置（注意不同环境时的"分割符"） window => cmd ：set NODE_ENV=production && xxxx mac => shell : NODE_ENV=production 空格 xxxx 5-2-2、package.json=>script命令中设置 彩蛋：在新建package.json文件时，我们可以使用npm init -y 快速创建（yes 表示一路默认创建，还有 -f 表示 force） from:https://blog.csdn.net/jwl_willon/article/details/81054978
View Details解决方案： npm config set user 0 npm config set unsafe-perm true 报错： Unable to save binary /var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/node-sass/vendor/linux-x64-64 : { Error: EACCES: permission denied, mkdir '/var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/node-sass/vendor' at Object.mkdirSync (fs.js:753:3) at sync (/var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/mkdirp/index.js:71:13) at Function.sync (/var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/mkdirp/index.js:77:24) at checkAndDownloadBinary (/var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/node-sass/scripts/install.js:114:11) at Object.<anonymous> (/var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/node-sass/scripts/install.js:157:1) at Module._compile (internal/modules/cjs/loader.js:689:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10) at Module.load (internal/modules/cjs/loader.js:599:32) at tryModuleLoad (internal/modules/cjs/loader.js:538:12) at Function.Module._load (internal/modules/cjs/loader.js:530:3) errno: -13, syscall: 'mkdir', code: 'EACCES', path: '/var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/node-sass/vendor' } > node-sass@4.11.0 postinstall /var/lib/jenkins/workspace/uploadH5_download_app/download/node_modules/node-sass > node scripts/build.js ———————————————— 版权声明：本文为CSDN博主「T&K」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。 原文链接：https://blog.csdn.net/sinat_41780498/article/details/88737365
View Details背景 Element UI 是 PC 端比较流行的 Vue.js UI 框架，它的组件库基本能满足大部分常见的业务需求。但有时候会有一些定制性比较高的需求，组件本身可能没办法满足。最近在项目里就碰到了。 很多页面都需要用到表格组件el-table。如果没有给el-table-column指定宽度，默认情况下会平均分配给剩余的列。在列数比较多的情况，如果el-table宽度限定在容器内，单元格里的内容就会换行。强制不换行，内容要么在单元格内滚动，要么就会溢出或被截断。 产品想要的效果是：内容保持单行显示，列间距保持一致，表格超出容器允许水平滚动。el-table-column是支持设置固定宽度的，在内容宽度可预知的情况下，也能满足这个需求。问题就在于如何让列宽动态适应内容的宽度。在官方文档也没找到这样的选项，应该是组件本身不支持。 技术方案 于是想到了动态计算内容宽度的方案。网上也有人提过这个思路，做法是根据内容字符数来计算宽度。这种方法有几个局限： 内容必须是文本 不同字符宽度不一，结算结果不够准确 需要在渲染前操作数据，不利于解耦 我采用了另一种思路，还是动态计算内容宽度，但是根据实际渲染后的 DOM 元素宽度，这样就能解决上面三个问题。 具体怎么做呢？通过查看渲染后的 DOM 元素发现，el-table 的表头和内容分别用了一个原生table，通过colgroup设置每列的宽度。就从这里入手，col的name属性值和对应的 td的class值是一致的，这样就可以遍历对应列的所有单元格，找出宽度最大的单元格，用它的内容宽度加上一个边距作为该列的宽度。 具体实现 怎么计算内容宽度呢？这是个比较关键的步骤。渲染后的每个单元格有个.cell类，用white-space: nowrap; overflow: auto;设置为不允许换行，内容超出后可滚动，同时设置display: inline-block;以便计算实际内容宽度。这样，最终的宽度可通过.cell元素的scrollWidth属性得到。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
function adjustColumnWidth(table) { const colgroup = table.querySelector("colgroup"); const colDefs = [...colgroup.querySelectorAll("col")]; colDefs.forEach((col) => { const clsName = col.getAttribute("name"); const cells = [ ...table.querySelectorAll(`td.${clsName}`), ...table.querySelectorAll(`th.${clsName}`), ]; // 忽略加了"leave-alone"类的列 if (cells[0]?.classList?.contains?.("leave-alone")) { return; } const widthList = cells.map((el) => { return el.querySelector(".cell")?.scrollWidth || 0; }); const max = Math.max(...widthList); const padding = 32; table.querySelectorAll(`col[name=${clsName}]`).forEach((el) => { el.setAttribute("width", max + padding); }); }); } |
中间的探索过程比较繁琐，但最终的代码实现却非常简洁。在什么时候触发列宽计算呢？自然是组件渲染完成后。为了方便重用，我采用了 Vue 自定义指令的方式。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
Vue.directive("fit-columns", { update() {}, bind() {}, inserted(el) { setTimeout(() => { adjustColumnWidth(el); }, 300); }, componentUpdated(el) { el.classList.add("r-table"); setTimeout(() => { adjustColumnWidth(el); }, 300); }, unbind() {}, }); |
更进一步，我封装了一个 Vue 插件叫v-fit-columns，已经发布到 npm 仓库，直接安装即可使用。 安装：
|
1 |
npm install v-fit-columns --save |
引入：
|
1 2 3 |
import Vue from 'vue'; import Plugin from 'v-fit-columns'; Vue.use(Plugin); |
使用：
|
1 2 3 4 5 |
<el-table v-fit-columns> <el-table-column label="No." type="index" class-name="leave-alone"></el-table-column> <el-table-column label="Name" prop="name"></el-table-column> <el-table-column label="Age" prop="age"></el-table-column> </el-table> |
源码仓库在这：https://github.com/kaysonli/v-fit-columns ，欢迎各位不吝赐教和 Star！ 总结 这个方案多少有点 Hack 的意味，只顾实现需求，可能在其他方面还有点瑕疵，比如渲染完后会稍微闪一下（因为要重新调整宽度，会出现 reflow）。不过从最终实现的效果来看，还算令人满意，至少产品经理提着他的两米大刀走了……他可是为了这个效果，蹲守在我电脑前半个下午，非要我实现不可！在手摸手的胁迫下，总算完事交差了…… from:https://www.cnblogs.com/lzkwin/p/13575805.html
View Details将日期时间转换为指定格式，如：YYYY-mm-dd HH:MM表示2019-06-06 19:45
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
function dateFormat(fmt, date) { let ret; const opt = { "Y+": date.getFullYear().toString(), // 年 "m+": (date.getMonth() + 1).toString(), // 月 "d+": date.getDate().toString(), // 日 "H+": date.getHours().toString(), // 时 "M+": date.getMinutes().toString(), // 分 "S+": date.getSeconds().toString() // 秒 // 有其他格式化字符需求可以继续添加，必须转化成字符串 }; for (let k in opt) { ret = new RegExp("(" + k + ")").exec(fmt); if (ret) { fmt = fmt.replace(ret[1], (ret[1].length == 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0"))) }; }; return fmt; } |
用法：
|
1 2 3 |
let date = new Date() dateFormat("YYYY-mm-dd HH:MM", date) >>> 2019-06-06 19:45` |
2020-11-23: 如果对日期时间处理的需求较多, 推荐moment.js这个日期处理类库, 简单方便. 作者：雷子_ 链接：https://www.jianshu.com/p/49fb78bca621 来源：简书 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
View Details在watch中使用this要注意，不能用箭头函数，否则会出错，例如：
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
<template> </template> <script> export default{ data(){ return { isLogin: false } }, watch:{ isLogin: (newVal, oldVal) => { newVal && this.updateLogin() } }, methods:{ updateLogin(){ console.log(`update login`) } } } </script> <style scoped> </style> |
箭头函数要改为function的形式，如下：
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
<template> </template> <script> export default{ data(){ return { isLogin: false } }, watch:{ isLogin: function(newVal, oldVal) { newVal && this.updateLogin() } }, methods:{ updateLogin(){ console.log(`update login`) } } } </script> <style scoped> </style> |
from:https://blog.csdn.net/liubangbo/article/details/115242420
View Details转载: https://www.cnblogs.com/zccfun/p/6054533.html JS提供三个截取字符串的方法,分别是:slice(),substring()和substr(),它们都可以接受一个或两个参数: var stmp = "rcinn.cn"; 使用一个参数 alert(stmp.slice(3));//从第4个字符开始,截取到最后个字符;返回"nn.cn" alert(stmp.substring(3));//从第4个字符开始,截取到最后个字符;返回"nn.cn" 使用两个参数 alert(stmp.slice(1,5))//从第2个字符开始，到第5个字符；返回"cinn" alert(stmp.substring(1,5));//从第2个字符开始，到第5个字符；返回"cinn" 如果只用一个参数并且为0的话，那么返回整个参数 alert(stmp.slice(0));//返回整个字符串 alert(stmp.substring(0));//返回整个字符串 返回第一个字符 // 1.位位截取 alert(stmp.slice(0,1));//返回"r" alert(stmp.substring(0,1));//返回"r" //上面的例子中我们可以看出slice()和substring()的用法是相同的，返回的值也一样， //但当参数为负数时，他们的返回值却不一样，看下面的例子 alert(stmp.slice(2,-5));//返回"i"；实际上是slice(2,3)，负数加上字符串长度转换成正3，(若第一位 >= 第二位, 则返回空字符串); alert(stmp.substring(2,-5));//返回"rc"； 实际上是substring(2,0),负数都转换为0, substring总是把较小的数作为起始位置。 // 2. 位位截取 和 位数截取 alert(stmp.substring(1,5))//从第1位开始，截取到第5位；返回"cinn" alert(stmp.substr(1,5)); //从第1位开始，截取5个字符；返回"cinn." var phone = 15989012100; phone.slice(-6) 取倒数后6位(第二个参数不用写0)，return ‘012100 ’； phone.slice(-6，-4) 取倒数后4位到倒数6位，（-6+11，-4+11）=（5,7）；
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
// 日期比较大小 当日期每个月都小1时 var nowdate = new Date(); item = 2016-7-16; temp = item.split('-'); if (temp[0] != curYear || temp[1] != curMonth) { return; } temp[1] = parseInt(temp[1]) + 1; date = new Date(temp.join('-')); if(date>=nowdate){ 执行A； }else{ 执行B； } |
替换指定字符串后的字母
|
1 2 3 |
var abc = 'adadada=ss'; var j = abc.substring(abc.indexOf('=')+1,abc.length); var dsd =abc.replace(j,'haha'); --> dsd = 'adadada=haha' |
frm:https://blog.csdn.net/qq_38719039/article/details/82219912
View Details