唯一的wataru-CSDN博客

原创 Vue.js设计与实现——通过Proxy实现简单的响应式系统

【代码】Vue.js设计与实现——通过Proxy实现简单的响应式系统。

2024-05-07 00:26:51 254

原创 v-if导致el-button的disabled属性动态修改失败，加key解决（虚拟列表+el-checkbox出现勾选/未勾选的闪现问题同理解决）

虚拟列表的el-checkbox，el-checkbox没有设置key属性时，在滚动虚拟列表时，会出现。

2024-01-02 11:59:35 1155

原创没有使用uglifyjs，但是打包报UglifyJs错误；Unexpected token: name (raf) [main_25188b.js:121200,4]

尝试了很多方法，没能够拿到 GitLab 或 Docker build 后的代码，拿不到 main_25188b.js 文件，就一直无法从这个文件里查看是哪里的代码出现问题。第三行包含的文件：清空，不要有任何字符或空格，如果有很明确的报错地方，也可以将该文件夹的名称写上去，如果确定就是node_modules报错，可以写上。只需要找出是哪个依赖包的 js 文件没有编译为 es5 ，将这个依赖包 include 进 babel-loader 中，就可以解决这个问题。所以我们是哪个依赖包出了问题。

2023-10-27 19:18:49 702

原创纯JavaScript简单实现移动端网页的上拉加载、下拉刷新

公司要在安卓软件中，添加H5网页包，实现订单卡片列表，要求有上拉加载、下拉刷新的功能。

2023-06-26 18:26:27 1402

翻译 gitlab CI/CD ：创建一个复杂的pipeline流水线

本教程通过小的迭代步骤引导您配置一个日益复杂的 CI/CD 管道。管道始终具有完整的功能，但是每一步都会获得更多的功能。当你完成这个教程，你就可以在gitlab.com中拥有自己的新项目，并且可以在Docusarus中让你的文档网站运行起来。Docusaurus 是 Facebook 专门为开源项目开发者提供的一款易于维护的静态网站创建工具，使用 Markdown 即可更新网站。构建一个带有主页、文档、API、帮助以及博客页面的静态网站，只需5分钟。

2023-06-13 01:26:59 1568

原创 qrcodejs2生成二维码，通过canvas绘制带边框+中间logo的二维码图片，下载二维码

view.vue 文件，scss 样式部分，设计要求二维码要有圆角边框。中,再绘制canvas之前先扩展绘制圆角矩形的方法。上面文章详细讲解了坐标的计算，有兴趣的可以前去查看。view.vue 文件，javascript 部分。1、通过canvas去绘制边框+二维码+logo。在 view.vue 文件中，HTML部分。2、通过a.download 去下载图片。粗略代码，部分代码省略。

2023-06-09 15:05:36 7321 2

翻译 GitLab CI/CD variables ；GitLab CI/CD变量（翻译）

GitLab CI/CD 预置了一些 CI/CD 变量，可用于pipeline 配置文件和job脚本。这些变量包括了一些关于job、pipeline的信息，以及在pipeline触发或运行时你可能会需要的其他值。变量名受限于shell这个执行脚本的运行程序。你可以手动为一个特殊的pipeline重写变量的值，或者在人工pipelines里预先填充变量的值。在你的 .gitlab-ci.yml 文件避免使用硬编码。控制 jobs 和 pipelines 的行为。保存你想要重复使用的值。预置的CI/CD变量。

2023-02-08 10:22:31 482

原创 gitlab-ci配置

【代码】gitlab-ci配置。docker,namespace,variables,script

2023-02-07 13:23:14 854

原创 vue-i18n插入变量，HTML等

【代码】vue-i18n插入变量，HTML等。

2022-12-23 19:04:54 3240

原创 git submodule fatal: please stage your changes to .gitmodules or stash them to proceed

git submodule 子模块删除/添加$ git submodule add gitlab.xxx.com/xxx/sub_project1.git$ git rm --cached sub_project1sub_project1 already exists in the indexPlease stage your changes to .gitmodules or stash them to proceed

2022-10-18 17:55:45 2933

原创 element-ui et -i 编译默认主题报错：ReferenceError: primordials is not defined

1. 之前全局安装过 element-theme用什么node 版本安装的，就用什么版本去卸载 element-theme2. 把node版本改成 11.15.0，用这个版本去全局安装 element-theme去执行 et命令后，切换到node v11.15.0，重新安装 element-theme再执行et，就没有报错。

2022-09-02 15:53:19 959

原创 vite、vue3本地页面正常显示不刷新，外网穿透后页面不停刷新

明明本地不会刷新，但映射到外网就会不停刷新页面。百度了一篇CSDN文章：vite项目通过外网域名访问无限刷新的解决办法，没有解决我的问题。我使用的是natapp进行外网穿透。报错信息是：在natapp 的外网穿透配置中，映射的本地host和端口是：127.0.0.1:3000根据natapp应用的映射信息：natapp 提供的地址，内已经包含了端口，而报错信息是，也就是说，我们访问的地址其实是：，页面不能正常访问导致不断刷新。解决办法：在中搜索 new Websocket，搜

2022-06-13 14:55:06 3739 11

原创【深入浅出HTTPS】理解HTTP

本文参考【深入浅出HTTPS】(作者：虞卫东)书籍，github地址：https://github.com/ywdblog/httpsbook文章目录HTTP的定义HTTP语义HTTP的定义HTTP：超文本传输协议，它是在互联网中在客户端和服务器进行通信的一种规则，它规定了客户端可以用什么文本格式、HTTP语义HTTP消息包括两个部分：HTTP语义和HTTP实体。http 消息由三部分组成：请求行或响应行HTTP 头部（请求头、响应头）HTTP 实体（请求实体、响应实体）请求行、响

2022-05-18 23:06:15 2724

原创【深入浅出HTTPS】什么是web

本文参考【深入浅出HTTPS】(作者：虞卫东)书籍，github地址：https://github.com/ywdblog/httpsbook什么是web【广义】web：万维网，WWW (World Wide Web)；打开一个浏览器，输入url，获取到HTML页面浏览信息的过程。web是一种信息索取方式，是互联网的某个子应用。用户是信息的索取方浏览web信息的软件是客户端（常见客户端：浏览器）信息的提供方是服务器，负责信息的检索和发送。HTTP：负责数据请求和响应。（不是负责数据传输，数

2022-04-20 12:59:28 2104

原创 NET::ERR_CERT_AUTHORITY_INVALID 您的连接不是私密连接，此网站使用了HSTS...

这是证书授权无效问题。NET::ERR_CERT_AUTHORITY_INVALID证书过期。延长证书的有效期可能手动设置的日期，超过了证书的有效期？关掉系统的手动设置的时间。使用了抓包工具，证书被抓包工具劫持了CA，浏览器不认这个CA，所以提示错误。把抓包工具关掉。.........

2022-04-19 19:16:48 11413

原创【bug】router-link没有编译为a标签

问题：原因一：use 顺序错误引入vue-router后，在注册的时候顺序错了，要先use，再 mount()，要先使用再挂载。否则挂载上去后，再使用，就不会编译了。解决方法：将 use 方法用在 mount 挂载前:原因二： vue-router 依赖文件有问题解决方法：重新 npm install vue-router@xxx ， xxx 为 vue-router 的版本原因三：main.js（入口文件）没有引入 vue-router解决方法：找到入口文件，import V

2022-04-17 21:47:53 1467 2

原创 module namespace not found in mapActions(): channel/

1. 检查仓库模块是否遗漏：namespaced: true // js// vuex-class ts// store/modules/channelexport const name = "channel"export const namespaced = trueexport const dynamic = true2. store引用模块是否没有加入channel模块// jsimport Vue from 'vue';import Vuex from 'vuex';

2022-04-13 11:26:00 653

原创 Error response from daemon: Get “https://xxx.xxx.com/xxx/“: unauthorized:

1. unauthorized: authentication required.drone.yml中配置的 username 和 password 是错误的# 测试环境-标准版(这玩意儿我不熟）# 此处省略大量代码# ... .. - name: build-xxx-image image: plugins/docker when: ref: - refs/heads/xxx # 某xxx分支有更新就触发打包 settings:

2022-04-11 16:25:57 2381

原创 nuxt在pages下建文件，本地能访问，线上404不能访问

以下网址都是虚拟网址、ip在官网开发过程中，要重构页面，将“官网介绍”页面，从PHP的模板tpl，改为前后端分离的形式。nuxt在pages下新建Vue文件，就能直接生成路径。我在pages/ 下新建了view/doctor.vue 文件。http://localhost:3002/view/doctor 能正常访问，等我更新到线上的预发环境（https://www.baidu.com/view/doctor）后，却显示页面404。1、线上地址是否输入错误，比如 https://www.baidu

2022-04-07 11:10:35 3990

原创 The “path“ argument must be of type string. Received undefined； at（Object.extname）

validateString下一行是 Object.extname(path.js:752:5)的报错。原因是在nuxt.config.js中：把plugins的参数写错了。// 此处省略大量代码// ... ...const baseConfig = require('./conf/'+xxx+'/nuxt.js');let plugins = ['@plugins/element-ui'];if(!ISDEMOVERSION) { plugins.push({url: '@plugin.

2022-04-01 17:10:41 4730 1

原创神策埋点collect_url和collect_element配置，collect_element没有触发

全埋点相关参数配置(https://manual.sensorsdata.cn/sa/1.17/web-7545350.html#id-.%E5%85%A8%E5%9F%8B%E7%82%B9(Web)v1.13-%E5%85%A8%E5%9F%8B%E7%82%B9%E7%9B%B8%E5%85%B3%E5%8F%82%E6%95%B0%E9%85%8D%E7%BD%AE)3.1. Web 元素点击3.1.1. heatmap 相关参数，提供了对于 $WebClick 事件的自定义设置和处理。h..

2022-02-16 16:36:57 580

原创 table表头固定，内容滚动

最近接到一个需求，要thead表头固定，tbody内容实现滚动。简单，给tbody加高度就行了。什么？！竟然不行失败了！！既然无法限制tbody本身的高度，那就给它套一个div，限制div的高度，让tbody在div里面滚就好了。但是！！table里面，不能在tbody外面套div！浏览器无法解析！会变成这样：哎呀，这也不行那也不行，到底要怎么搞？找了别人的代码，好家伙！可以用两个table来实现这个功能。第一个table管理thead，第二个table管理tbody，再用div去包裹第二

2021-06-16 10:06:39 3967 6

原创 Vue + TS笔记：sync修饰符和 @Emit(‘upate:visible‘)

父组件<Father> <Child visible.sync="showChild" ></Child></Father>子组件// Child 组件<template> <div class="child-component" v-show="visible"> <i class="icon-close" @click="closeHandle"></i> </div>&l

2021-06-08 11:05:19 1836

转载数组去重的几种方法

发现了一篇关于JavaScript数组去重的高性能方法的博客！！！原文地址：JavaScript 高性能数组去重：https://www.cnblogs.com/wisewrong/p/9642264.html作者：Wise.Wrong请大家点击原文地址查看以下内容均为转载，只是怕博客园打不开，所以记录了博客内容。如果博客园地址能打开的话，请大家在博客园观看！----------------- 转载内容开始 -------------------中午和同事吃饭，席间讨论到数组去

2021-04-27 14:16:08 338

原创 css 通过background将两张图合成一张图显示

需求背景：后台返回两张图，一张是默认背景图bgimg，另一张是显示在背景上的图案img。在列表中，bgimg一般不变，但img会根据不同的花的类型返回不同的图片。需求是将两张图片叠在一起，让人以为是一张图片。背景图bgimg：图案img：需求效果：第一种方法：background<div class="list-item"></div><style>.list-item { backgroud:url(img) right bottom no

2021-04-25 15:21:12 4319

原创防止CSRF攻击

什么是CSRF?CSRF ： cross-site-request-forgery：跨站请求伪造攻击者通过一些技术手段欺骗用户的浏览器去访问一个自己曾经认证过的网站并运行一些操作（如发邮件，发消息，甚至财产操作如转账和购买商品）。由于浏览器曾经认证过，所以被访问的网站会认为是真正的用户操作而去运行。这利用了web中用户身份验证的一个漏洞：简单的身份验证只能保证请求发自某个用户的浏览器，却不能保证请求本身是用户自愿发出的。Cookie 往往用来存储用户的身份信息，恶意网站可以设法伪造带有正

2021-03-11 16:20:56 380 2

原创 Symbol的作用

1.防止变量名起冲突2.可以使用symbol避免魔术字符串魔术字符串：在代码中多次出现、与代码形成强耦合的某一个具体的字符串或者数值。 function getdata(val) { case 'magicString' : return ['this','is','magicString'] default : return [] } let data = getData('magicString') // 'magicString' 就是魔术字符串风格良好的

2021-03-02 16:23:42 2334

原创阮一峰 - ES6 数值的扩展 Number 对象、Math对象、BigInt类型和对象

转载自【阮一峰】数值的扩展:https://es6.ruanyifeng.com/#docs/number1.二进制和八进制表示法从 ES5 开始，严格模式下，八进制不能使用数字0 作前缀来表示。 ES6 明确，八进制要使用数字0和字母o(大小写都可)，即0o（0O）表示。二进制要使用前缀 0b(或0B) 表示。 ES6中，要将 0b和0o前缀的字符串数值，转换为十进制，要使用 Number 方法。Number(0B111) // 7Number(0o10) // 82. Nu

2021-02-01 18:07:40 384

原创 ES6 -解构赋值

变量的解构赋值2.对象的解构赋值注意点(1) 如果要将一个已经声明的变量用于解构赋值，不可直接用大括号包住变量去解构赋值，而要在变量解构赋值的表达式的外层添加一个圆括号。let x;({x} = {x: 6}); // 正确写法{x} = {x: 6}; // SyntaxError: syntax error/* 报错原因： JavaScript 将 {x} 理解为一个代码块，从而发生语法错误。只有不将大括号放在行首，才能避免 JavaScript 将其解释为代码块，才能解决

2020-12-24 17:44:06 218 1

原创 ES6 字符串的扩展

文章目录1.字符串的 Unicode 表示法2.字符串的遍历器接口3.可直接输入 U+2028 和 U+20294. JSON.stringify() 的改造5. 模板字符串6.实例：模板编译1.字符串的 Unicode 表示法超出码点在 \u0000~\uFFFF 这个范围的字符，必须用两个双字节的形式表示。javascript 无法正确识别。改进：使用大括号包住码点，JavaScript 就能正确解读该字符。"\u{20BB7}"// ????"\u20BB7"// " 7"

2020-12-24 17:42:29 81 1

原创 CSS模块化遇到的问题-（学习自《深入React技术栈》）

CSS 模块化过程中遇到的问题一、全局污染在写组件过程中，引入的 css 是全局的，如果不同组件中存在相同的 class 或 id 值，样式会被后写的样式覆盖，导致样式错乱。这时候就出现了丑陋的 !important 、 inline !important 和复杂的选择器权重计数表（标签名权重1，class名权重10，id名权重100等），使得代码的犯错概率和使用成本提升。Web Comonent 标准中的 Shadow DOM 能解决这个问题，但由于他彻底局部化，外部不能修改样式。（写组件的时候，给组

2020-11-24 17:47:16 139

空空如也

空空如也