浏览模式: 标准 | 列表分类:Javascript
Submitted by gouki on 2023, September 3, 10:10 PM
一般而言，elementUI的prop+rules可以用来对字段进行校验。大多数情况下感觉都没什么问题，毕竟官方的例子摆在那里。element-plus的例子没有的，element-ui2的例子也比较全。
但element-plus和elementui中都 没有对number类型进行介绍，如果直接{type:'number',....} 不管你填入什么值 ，都会报错，即使你用el-input+type="number"，效果仍然一样
这是因为vue对所有的input默认都是当成string来解析的，因此你对一个string判断number，肯定就是失败的
网上80%的例子都是说采用：v-model.number="form.xxx" 来处理，确实，这样处理是OK的，但你会发现一个很严重的问题，那就是能输入的内容都是integer了。没法有小数点
这时候其实还是可以看element-plus所使用的async-validator的官方例子，因为黑夜的象{required:true},{type:"array"}等，都是来自于async-validator的官方支持，而官方是支持type="number"的。现在剩下的其实就是将el-input中的内容转为Number进行判断。仅此而已
官方的例子中有transform，这是一个钩子函数，用于验证前将数据进行简单的转换，比如我们就可以{type:"number",transform: Number}，如果不能转成Number，其实也就失败了
---
临时写的，就先这样，后续有机会慢慢写的更详细一点，也或许就不再写了
参考：
1、https://github.com/yiminghe/async-validator
2、https://www.cnblogs.com/alabo1999/p/14990310.html （正好找到这一篇足够详细，估计我也不会再多写了）
Javascript | 评论:0
| 阅读:968
Submitted by gouki on 2023, August 31, 10:14 AM
1、参考官方文档，将一些不用的 filters ,等去掉
2、将原来的全局变量挂载，尽量去掉，用的时候 再加载好了，现代 IDE 基本上都会在你用的时候 自动加载进来
3、如果不使用 compositionAPI，基本上就是原来的代码不变
4、layout 写在 router 里比写在页面里方便 （如果是基于 inertiaJS 的 laravel 项目，当我没说）
5、用了 vite 后，原来的 process.env，要使用 import.meta.env来获取，import.meta.env，只认 VITE_开头的变量
6、用 autoImport/unplugin 后确实方便很多，但如果用了 element-plus 又用了 tailwindcss，要注意引入的顺序，否则象 button 上的样式可能会被覆盖
Javascript | 评论:0
| 阅读:1030
Submitted by gouki on 2023, June 14, 12:19 AM
由于打包教程网上很多，我就不多说了。只说自己踩的一些坑吧
1、builder.json 中。files 节点里的内容，就是最终打包进 APP 的资源。所以，想打包的话就在这里指定。可以是文件和目录
2、main.js 中，涉及到路径的，尽量使用 app.getAppPath()，网上一些教程都是 path(__dirname,'../dist/index.html')之类的，记得换成 app.getAppPath()，同时 ../dist，换成和 appPath 对应的目录
3、因为是用 vite 打包的。base 节点，原来默认都是 / ，electron的话，如果用 / ，就是绝对路径了。记得换成 ./ 的相对路径
4、打包的项目中，尽量不要 出现：location.href ，所有的跳转都通过 router.push({path:"/xxx"})
5、router，如果原来是用 createWebHistory 的，记得使用 Hash 的方式
6、request 请求的时候 ，请带上 baseURL（正确的 http 路径）。因为在 development 模式下，有 proxy 的时候 都是通过代理 访问，路径往往实际并不带域名。
7、js-cookie 这样的 cookie 操作类应该是没法用了，改换成 localStorage 吧。
---
先想到这么多记录一下，如果后续再想到，就继续开新篇记录
Javascript | 评论:0
| 阅读:1534
Submitted by gouki on 2023, June 13, 11:58 PM
js 真是一个有意思的东西。node_modules 到处可见，而且目录还特别在，然后 node 12\14\16\18，现在都快20了。
于是就会出现一个情况，磁盘里有 N 个 JS 项目，各自基于不同的 node 版本。当然 node 有 n / nvm 等相应的工具。直接运行就可以切换相应的版本。但如果你想同时开发两个不同版本的项目，就有点麻烦了。这边目录先 n 18，然后 npm run ，再回到另一个目录 n 16 && npm run 。看起来没问题，各自都能跑。
可是如果现在 n18的项目需要杀进程重启。那就得再运行 n18，恢复成18，然后再 run .....
不是说其他语言没有这种情况，比如 PHP，其实也有很多版本，还有 Python。但 PHP 可以通过安装不同的 php 版本，再使用 nginx 进行反代就完事了。python 也有 virtualenv。而 JS 居然没有。
搜了下网络，突然发现了 nodeenv。居然是利用 virtualenv 的方法来维护多版本。nodeenv 的安装我就不细说了：pip install nodeenv 就行了。
在相应的目录下，运行一下：nodeenv --node=16.xx.x --with-npm {dir}。这样一个简单的方法就在 dir 目录下生成了一个环境版本。然后运行 . ./dir/env/active ，会发现命令行前面多了个括号(env) <---根据目录名来。
在这个目录下面，直接运行 node -v，你会发现这个目录下的 node 就是你刚才指定安装的版本。也因为是--with-npm，所以 npm run 就直接可用了。
一切就是这样的自然。
当然也不是没有缺点，比如，这个 env的目录会很大，毕竟一个 node / npm，都在里面。但，至少可以解决问题了
Javascript | 评论:0
| 阅读:1535
Submitted by gouki on 2023, May 17, 8:44 AM
在使用 exceljs 进行导出的时候 。如果是全部自己写的代码那控制起来会比较方便。你 mergeCell 或者 splitRow，都没什么大问题，但要注意几点
1、时刻观察：worksheet._merges，因为在 mergeCell 的时候 已经合并过的表，是不能再次被合并的。会报错，这时候 可以用 getCell().model，看看是不是 master。如果是的话，可以先 unMergeSells()
2、在 mergeCells后，如果你有 insertRows 等类似的操作。只要影响到刚才 merge 过的单元格时，原来所有的 merge 都会被清空，这点要注意。
3、worksheet 可以设置冻结行和列，直接通过 worksheet.views，就可以定义 state:frozen，定义好左上角开始的坐标，然后定义 xSplit 和 ySplit 就行了。
更多的使用方法，还是看官方吧：https://github.com/exceljs/exceljs/blob/master/README_zh.md
Javascript | 评论:0
| 阅读:1653
