COCOLI_BK的博客

原创 Vue---vuex状态管理工具的前生今世

vuex是一个专为 Vue.js 应用程序开发的状态管理模式 + 库,它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。

原创 Vue---11种组件传值方式总结，总有一款适合你

以上示例代码展示了Vue 2中不同组件间通信方法的实现方式。注意，对于Pinia和Vue 3+特有的通信方式，这里没有提供Vue 2的示例代码。

原创 JavaScript---双叹号的使用

处理获取不到对象值时转为布尔值的情况var o={flag:true}; var test=!!o.flag;//等效于var test=o.flag||false 由于对null与undefined用!操作符时都会产生true的结果，所以用两个感叹号的作用就在于，如果明确设置了o中flag的值（非 null/undefined/0""/等值），自然test就会取跟o.flag一样的值；如果没有设置，test就会默认为false，而不是 null或undefined。 ....

原创 CentOS------yum安装报错：Errors during downloading metadata for repository ‘AppStream’,源报错处理，简洁易懂

yum install ：：：Errors during downloading metadata for repository ‘AppStream’

原创 Python------python爬虫数据导入MongoDB数据库

开发前环境配置:Pycharm开发工具下载:Python下载:链接：https://pan.baidu.com/s/19QWYN91vzJPhaxVEEgx64A提取码：nbls64位系统的安装这个!!!MongoDB下载:链接：https://pan.baidu.com/s/1N1TrhoRDgqTmgQlrY6CUXg 提取码：52101. 在根目录中创建mongo.conf文件:复制以下内容dbpath=E:\mongodb\data #数据库路径...

原创 Array------已知数组的值value,查找对应的索引index

第一种: 利用map和indexOf来实现// 一般数组let arr = [1,2,3,4,5];let params = 1;var index = arr.indexOf(params); // 0// 对象数组var arr= [ {value: 100}, {value: 200}, {value: 300}, {value: 400}, {value: 500}];var params = 200;var index = imageList

原创 Git---git 报错 fatal: No such remote ‘origin‘ 的解决方法

解决方法:在本地运行git remote -v，没有显示任何地址，需要添加，而不是修改。运行：

原创 npm---下载资源包速度慢，切换淘宝源（粉丝福利）

先来结果执行代码，再看下面详情，干净利落~下包的命令仍然是npm。下包的命令是cnpm。

原创 单词记忆-轻松记忆10个实用英语单词（14）

职位（如"permanent staff"正式员工）；：基因缺失（如"gene deletion"）；：基因缺失（如"gene deletion"）；：公平性（如"equal rights"平等权利）；：公平性（如"equal rights"平等权利）；：障碍（如"barrier"）；：排他性（如"only child"独生子女）；：障碍（如"barrier"）；：排他性（如"only child"独生子女）；：印刷字体（如"in print"）；：印刷字体（如"in print"）；

原创 单词记忆-轻松记忆10个实用英语单词（13）

拆分“identi-”（身份） + “-cal”——身份相同。：联想“blackboard”（黑板）——板子的常见用途。：联想“cushion”（垫子）——缓冲区的功能类似垫子。：联想“construct”（建造）——指令是建造的指南。：联想“protect”（保护）——检测是保护的前提。：联想“imagine”（想象）——图片是想象的载体。：联想“hatch”（孵化）——捕捉与孵化都需要动作。：联想“glide”（滑行）——与滑动动作相似。：联想“day”（天）——与每日相关。

原创 单词记忆-轻松记忆10个实用英语单词（12）

拆解“a-ver-age”，“ver”类似“verify”（核实），需计算核实。：名词与“control”（控制）相关，动词与“solace”（安慰）同源。：反义词“decrease”（减少），前缀“in-”表向内/加强。：词根“repeat”（重复）加形容词后缀“-itive”。：联想“ruler”（尺子/统治者），规则需要衡量或掌控。：对比“lower”（较低的），直接对应“up”（向上）。：联想“tale”（故事），有天赋的人常被传颂。：符号“-”直接对应，对比“plus”（加）。

原创 单词记忆-轻松记忆10个实用英语单词（11）

拆分“micro-”（微小）+“soft”（软），联想“微小软件”起家的公司。：前缀“pro-”表“向前”，词根“duce”表“引导”，向前引导即“产出”。：词根“place”（地点）+“-ment”（名词后缀），强调“定位动作”。：/prəˈdjuːs/（动词）；：联想“speak”（说）加后缀“-ch”，强调“说的内容”。：词根“ply”表“折叠”，引申为“贴合需求”（申请或涂抹）。：词根“cept”表“拿取”，概念是“从现象中提取的核心”。：前缀“de-”表“向下”，联想“向下压进度”导致延迟。

原创 单词记忆-轻松记忆10个实用英语单词（10）

原创 单词记忆-轻松记忆10个实用英语单词（9）

/ˈaɪðər/ 或 /ˈiːðər/：词典给出了该术语的明确定义。：你可以选择任何一个选项。：在方程中，“n”是指数。：数据以图形化方式呈现。：昂贵不必然意味着更好。：实际成本高于预估。

原创 单词记忆-轻松记忆10个实用英语单词（8）

additionaldearlyprompttransportablepassdisplaypredictpackgreatlyanytime

原创 单词记忆-轻松记忆10个实用英语单词（7）

国会将于下周对该法案进行投票。：他是一位坚定的共和主义者。：因素，因数，指数，凝血因子。：时间是这个项目的关键因素。：他自认为是一名民主主义者。：这次营销活动提升了销量。：她是古代历史的权威专家。：互联网提供了海量信息。：联邦政府宣布了新政策。：过去十年技术飞速发展。：这个国家实行民主制度。：代表大会，政治组织。：权威，影响力，专家。：民主的，平等参与的。

原创 单词记忆-轻松记忆10个实用英语单词（6）

本文解析了10个常用英语单词，包括transfer（转移）、position（位置）、restore（恢复）、presence（存在）、ring（戒指）、message（信息）、via（通过）、generate（生成）、printout（打印输出）和possibly（可能地）。每个词条均包含含义解释、国际音标注音、实用例句及中文翻译，帮助学习者掌握正确发音和用法。内容涵盖日常交流、商务办公等场景，适合英语初学者巩固基础词汇。

原创 单词记忆-轻松记忆10个实用英语单词（5）

英语单词解析摘要：本文解析10个常用英语单词，包括技术术语(bug错误、emulator模拟器)、数量单位(mega百万)、农业词汇(crop庄稼)、时间概念(moment瞬间)、语言相关(translation翻译)、数学概念(remainder余数)、科学术语(physical物理的)、频率副词(often经常)和空间词汇(margin边缘)。每个词条包含音标、例句及中文翻译，涵盖计算机、农业、数学等多个领域，帮助读者准确理解单词含义及用法。

原创 单词记忆-轻松记忆10个实用英语单词（4）

本文整理了10个常用英语词汇，包括"trailing"（拖尾的）、"compiler"（编译器）、"whereas"（然而）、"cost"（成本）、"arrange"（安排）、"table"（表格）、"compose"（组成）、"instant"（瞬间的）、"build"（建造）和"experiment"（实验

原创 单词记忆-轻松记忆10个实用英语单词（3）

本文提供了10个常见英语单词的简明记忆方法。

原创 单词记忆-轻松记忆10个实用英语单词（2）

本文介绍了10个常用英语单词的简明记忆方法，包括短语（phrase）、字母（letter）、终止（abort）、概述（overview）、有效（effective）、独特（unique）、保存（preserve）、压缩（compress）、插入（insert）和保留（retain）。每个单词均提供标准读音标注（如/freɪz/）和实用例句（如"她重复短语以便记忆"），帮助学习者快速掌握词义和用法。这些词汇涵盖日常交流和学习场景，特别适合英语初学者系统记忆基础词汇，提升语言应用能力。

原创 单词记忆-轻松记忆10个实用英语单词（1）

本文提供了10个常用英语单词的简明记忆方法，包括typewriter（打字机）、lowercase（小写字母）等。每个词条包含含义、音标和实用例句，帮助学习者快速掌握词汇。例如，typewriter例句展示其使用场景，incompatible说明其应用限制。重点词汇覆盖设备、技术、行为等多个领域，适合英语初学者快速积累基础词汇。通过简短定义和生动例句的结合，有效提升单词记忆效率。

原创 Mac-获取开机时间（命令方式）

【摘要】本文介绍了获取系统开机时间的实用技巧：通过sysctl kern.boottime命令获取时间戳，其中sec即为开机秒数，再使用date -r命令将其转换为可读日期格式。示例展示了将时间戳1753922556转换为2025年7月31日的具体操作。该技巧适用于系统运维和故障排查场景，提供了快速获取系统运行时间的便捷方法。（99字）

原创 移动与桌面终端管理利器：Android、Windows、Mac 全平台精选指南

终端工具精选指南：Android推荐Termux（开源全能）、JuiceSSH（专业远程）和TermBot（轻量连接）；Windows优选Windows Terminal（官方多标签）、Cmder（开发者友好）和MobaXterm（全协议支持）；Mac首推iTerm2（生产力神器）、Alacritty（极简高性能）和Termius（全平台同步）。各平台工具均经实测，满足从基础操作到专业开发的终端需求，按场景选择可显著提升工作效率。

原创 《bignumber.js 速查手册：API 详解与最佳实践》

说明：每个方法都返回新的 BigNumber 实例，支持链式调用。

原创 UI-整合 ECharts 及其生态库后的全量汇总表

所有链接可直接访问，建议保存表格以备查阅！

原创 Vue 3 ～ 3.5 版本useTemplateRef使用

注意，useTemplateRef版本要在 3.5 以后才可使用，版本低的 ref 替代问题也不大～

原创 Vue 3 响应式 Ref 全解析：从基础到高阶应用

本文系统性地介绍了Vue3中与ref相关的API，包括ref、shallowRef、customRef、toRef和toRefs等，通过对比分析帮助开发者深入理解其差异与适用场景。ref适用于大多数常规响应式需求，shallowRef则用于性能优化，特别是在处理大型对象或第三方库实例时。customRef提供了更精细的控制，适用于复杂逻辑和异步操作。toRef和toRefs则用于保持响应性链接，特别是在解构或传递属性时。文章还提供了性能优化技巧和常见问题解答，帮助开发者根据具体需求选择合适的ref类型。

原创 React---新手上路学习里程开始！

先将 react 的技术文档走几遍，通读和试用语法和 demo 示例；今年目标是学会 react 并实际使用 react；其后找个对应的react 项目进行实际操作；这里立下目标，大家一起进步，一起成长。这里写一段话，记录我的计划和目标！

原创 UI组件---使用elementPlus+vue3开发下拉搜索组件(copy即用)

输入名称或ID，出现下拉框根据输入内容进行模糊匹配下拉框展示匹配到的内容-个框里最多展示5条超过5条可以向下滑动查看全部匹配到的内容1. 前言根据elementPlus的组件库，暂时无满足该需求的所有要求！故此记录一下；方便自己和大家以后使用！觉得好用的话辛苦大家点个关注哦！一个 Vue 3 UI 框架 | Element PlusSelect 选择器 | Element Plus。

原创 CSS---实现盒元素div内input/textarea的focus状态时给父元素加属性！

要实现当textarea文本框获得焦点时，自动给其父元素添加类名或样式，您可以使用 CSS 的伪类选择器。这个选择器会在元素本身或其任何子元素获得焦点时应用样式。

原创 服务器---centos上安装docker并使用docker配置jenkins

通过以上步骤，你可以使用 Docker 安装并管理 Jenkins。Docker 提供了灵活且可移植的方式来部署和管理 Jenkins 服务。希望这些信息对你有所帮助！

原创 服务器---centos上前端从0到1配置项目部署

通过以上步骤，您可以在 CentOS 系统上配置 Nginx 反向代理、前端 Vue 项目、Git 仓库拉取、PM2 管理工具以及 Jenkins 自动化部署，实现项目的持续集成和部署。希望这些信息对您有所帮助！

原创 UI组件---如何设置el-pagination分页组件的背景色

具体的CSS规则取决于您想要更改的是哪个部分的背景色，例如普通页码、活跃页码、上下导航箭头等。以下是一些示例CSS规则，您可以根据自己的需求进行调整：/* 修改普通页码的背景色 */background-color: #您想要的颜色;/* 修改活跃页码的背景色 */background-color: #您想要的颜色;/* 修改上下导航箭头的背景色 */background-color: #您想要的颜色;请确保将#您想要的颜色替换为您希望设置的具体颜色代码。

原创 CSS---序号使用css设置，counter-reset、counter-increment、content配合实现备注文案的序号展示

其中注意如果是全数字的话，不会换行，需要自己修改使用哦！

原创 vscode---snippets配置全局代码片段，快捷开发！

举例：比如跳转登录，需要调用app的客户端方法，api调用跳转；但是跳转登录逻辑每个页面都有可能使用！为了方便重复敲代码，可使用vscode的代码片段功能！代码片段的作用：在开发一个项目时，经常会遇到好多同一个代码逻辑，可配置固顶逻辑的代码块，避免重复敲同一代码；

原创 React---创建项目的命令大集合（新手上路）

创建React项目有多种方式，以下是一些常用的命令和说明。

原创 Vue3---多种组件传值方式总结

在Vue 3项目中，Vuex是一个常用的状态管理库，它可以帮助你在多个组件之间共享状态。结合上述代码，您可以创建一个简单的Vue 3应用程序，其中包含一个用来发表消息的组件和另一个用来订阅消息的组件。状态会相应增加或减少，并且由于状态的响应式特性，所有使用了该状态的组件都会自动更新显示。如果需要，可以创建一个中间组件，但在这个示例中，我们将直接从父组件跳转到孙子组件。最重要的一点，想要ref传值赋值，一定要用方法的方式去调用，直接赋值无效！的示例，其中一个父组件提供数据，一个孙子组件通过注射获取这些数据。

原创 Vue---vue3+vite项目内使用devtools，快速开发！

我们在前期开发时，一般使用chrome或者edge浏览器，会使用vue-devtools或react-devtools（此插件个人未使用，可百度下是否可内嵌入项目！）来审查vue项目；这个需要安转浏览器插件才可支持！故此本博客的目的是，如果已经开发或者维护阶段的vue+vite项目如何临时插入该插件使用!创建vue3项目时，会提示是否安装devtools的插件！

原创 Git---git本地配置commit_template提交模板，规范开发

Commit Template 是一个预定义的文本文件，其中包含了提交信息的基本结构和指南。当开发者在进行代码提交时，Git 会根据这个模板自动生成或提示提交信息的格式，从而确保每次提交的信息都是一致且符合规范的。