狂野的心跳-CSDN博客

原创从0开始搭建react项目

第一次真正意义上接触 react 项目，做好了一步一步慢慢踩坑填坑的准备，本文就主要介绍如何完整的实现一个react项目。注：可能会因为公司安排其他任务，所以有可能会花很长一段时间完善这篇文章。第一步：搭建1、全局安装 create-react-app npm install create-react-app2、创建项目，安装初始依赖 create-re...

2019-11-21 11:04:12 545 1

文章目录`git 常用命名``项目文件拉取``全局配置用户名、密码``配置用户名``配置密码``分支查看、创建、删除``分支查看``分支创建``分支删除``代码提交``代码拉取``代码暂存``代码提交``分支合并``分支更新``更改远程仓库地址``日志查看`git 常用命名项目文件拉取git clone $projectUrl例：git clone https://xxxx.xxxx.xxxx全局配置用户名、密码配置用户名git config --global user.name $use

2021-06-18 11:54:57 189

原创 2020-09-01

Git SSH Key生成命令ssh-keygen -t rsa -C 描述（可用Git账号或者邮箱）进入C盘〉用户〉. ssh文件，打开Git Bashcat id_rsa. pub 即可查看公钥

2020-09-01 17:27:52 200

原创常用工具类函数（不定期更新）

/** * @description 加法函数，用来得到精确的加法结果 * @params {arg1} 加数 * @params {arg2} 加数 */export function Add(arg1, arg2) { arg1 = arg1.toString(); arg2 = arg2.toString(); let arg1Arr = arg1.split("."), arg2Arr = arg2.split("."), d1 = arg1Arr.length == 2 .

2020-08-28 10:22:48 306

原创 element表格自定义设置el-table-column表头宽度

<el-table height="100%" :data="tableData" border style="width: 100%"> <el-table-column show-overflow-tooltip :width="setColumnWidth('日期')" prop="date" ...

2020-08-19 10:30:09 11189 2

原创随机生成uuid

function setUUID() { function S4() { return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1); } return (S4() + S4() + "-" + S4() + "-" + S4() + "-" + S4() + "-" + S4() + ...

2020-03-05 11:05:06 227

原创 CSS文本超过2行省略号（...）显示

基础属性：（只能做到超出一行部分省略号显示）width: 200px; //宽度overflow: hidden; //超出文本隐藏white-space: nowrap; //不换行，只显示一行text-overflow: ellipsis; //超出部分省略号显示CSS3属性：（可做到超出 N 行部分省略号显示，行数可自定义）width: 200px; /...

2019-10-16 11:07:15 6826 1

原创 js对象数组根据某个共同字段分组

有时候我们需要将对象数组根据某个相同字段进行分组，下面就是我自己写的方法，亲测有效。完整代码：（将 id 相同的数据分在同一组） let dataArr = [ {id: 1, value: '值1'}, {id: 2, value: '值2'}, {id: 3, value: '值3'}, {id: 1, value: '值4'}, {id:...

2019-10-09 16:57:44 4562 1

原创 js获取某一天是今年的第多少周

function getWeek(y,m,d) { let day1 = new Date(y, parseInt(m) - 1, d); let day2 = new Date(y, 0, 1); let day = Math.round((day1.valueOf() - day2.valueOf()) / 86400000); return Math.cei...

2019-09-27 15:38:08 743

原创 git 常用命令

克隆 git clone 路径是否克隆成功 git pull(克隆项目)配置全局账户 git config --global user.name 用户命配置全局密码 git config --global user.password 密码查看所有分支 git branch -a切换指定分支 git checkout ******（分支名）添加本地缓存 git ...

2019-08-09 19:18:04 221

原创金额小写转换大写

直接上代码，亲测有效function transCnMoney(number){ let CN_MONEY = ""; let CN_UNIT = '仟佰拾亿仟佰拾万仟佰拾元角分'; number += "00"; let dot = number.indexOf('.'); if (dot >= 0) number = number...

2019-07-18 15:40:35 908

原创高德地图批量地理编码的问题

今天遇到需要将多个位置信息转换成经纬度，官方API说的依然是使用getLocation 方法，只需要传入数组就是了，但是我怎么试都只会返回数组中第一个数据的经纬度。写法如下：(只写js部分)let basicAddress = new AMap.Geocoder({ city: "全国", radius: 500});basicAddress.getLocation([...

2019-05-29 09:58:57 2178 4

原创 webpack安装、基础配置

首先新建一个文件夹，比如 my-first-webpack ，初始化项目，得到一个 package.json 文件npm init然后安装 vue、webpack、webpack-dev-servernpm install vue --savenpm install webpack webpack-dev-server --save-dev这里，我用的是 webpack...

2019-04-25 14:44:54 734

原创 JSON.parse()、JSON.stringify()实现深拷贝应注意问题

我们都知道，实现数据深拷贝，我们大多数人都是用的JSON.parse(JSON.stringify())方法，比如： function deepClone(obj){ let obj_ = JSON.stringify(obj), loneObj = JSON.parse(obj_); return loneObj } let a=[...

2019-02-18 17:42:10 5282

原创 js去掉字符串中的空格（左、右、首尾、中间）

项目中往往会遇到这类需求，比如用户输入信息的时候，在输入框输入了空格，不论是在前面还是后面或者在中间，我们都应该对其进行处理（中间出现空格大部分都是格式错误，应提示重新输入）。这里介绍直接用正则来去掉字符串中的空格。 let str1 = ' gzq joshua '; console.log(str1,111111111); console...

2019-02-18 14:49:47 2933 1

转载总结篇：写在最后

鄙人已付费购买，粘贴出来给更多前端爱好者学习。若掘金小册禁止此类操作，请联系看到这里，也就是要和大家说再见的时候了，其实还有很多想和大家分享的内容没能来得及一一阐述，但是没有关系，我相信在今后学习 Vue 的道路上我们永远会保持关注，彼此照应，一起学习，一起进步。而正所谓温故而知新，可以为师矣，接下来我们不妨一起回顾下本小册的主要内容。回顾与总结浏览小册目录，我们可以清楚的将小册的...

2019-02-14 09:43:33 207

转载开发拓展篇 3：尝试使用外部数据

鄙人已付费购买，粘贴出来给更多前端爱好者学习。若掘金小册禁止此类操作，请联系当你应用的 UI 层面已经趋于完善的时候，接下来你就需要去获取动态的数据来实现真实的应用场景。那么动态数据从哪里来呢？前端主要还是通过接口的形式获取。如果有专业的接口开发人员和你一起完成一个应用，那么你只需要和他定义好接口的入参和出参，然后进行调用就好了，这也是公司中前端与后台的常见合作方式。而在以下场景下，你...

2019-02-14 09:43:18 309

转载开发拓展篇 2：将 UI 界面交给第三方库

鄙人已付费购买，粘贴出来给更多前端爱好者学习。若掘金小册禁止此类操作，请联系当你了解了 Vue 项目构建和开发的基本知识后，我认为接下来你一定想亲自在构建出的项目中填充自己的业务和功能逻辑，因为目前其还是空白的。但是这里我不会教你如何实现一个具体的业务和功能模块，因为每个人想要实现的东西都可能不尽相同。如果你想快速开发一款应用，并且不想过多的操心页面 UI 层次的内容，比如你不想去实现一个...

2019-02-14 09:43:12 292

转载开发拓展篇 1：扩充你的开发工具

鄙人已付费购买，粘贴出来给更多前端爱好者学习。若掘金小册禁止此类操作，请联系在项目开发中，工具的使用起到了至关重要的作用，正所谓工欲善其事，必先利其器，掌握一些实用的开发工具能够使我们的开发效率事半功倍。那么我们应该掌握哪些开发工具的使用方法呢？其实一路走来，我们已经介绍的开发工具包括了 npm、yarn、webpack 以及一些集成在项目中的工具包，这些工具一定程度上都大大简化了我们的开...

2019-02-14 09:43:05 444

转载开发指南篇 5：Vue API 盲点解析

鄙人已付费购买，粘贴出来给更多前端爱好者学习。若掘金小册禁止此类操作，请联系在了解了一些实用的开发技巧和编码理念后，我们在项目的开发过程中难免也会遇到因为不熟悉 Vue API 而导致的技术问题，而往往就是这样的一些问题消耗了我们大量的开发时间，造成代码可读性下降、功能紊乱甚至 bug 量的增加，其根本原因还是自己对 Vue API 的 “无知”。本文将介绍 Vue 项目开发中比较难以理解...

2019-02-14 09:42:53 343

转载开发指南篇 4：数据驱动与拼图游戏

鄙人已付费购买，粘贴出来给更多前端爱好者学习。若掘金小册禁止此类操作，请联系数据驱动是 Vue 框架的核心特性之一，也是 Vue 响应式原理的具体体现，相信大家对其应该深有体会，尤其是在操作数据来触发页面更新的时候。为了让大家更加了解数据驱动的理念，并解决使用过程中可能出现的一系列问题，本文将结合比较常见和简单的 “拼图游戏” 来展示 Vue 数据驱动的魅力所在。效果展示首先我们先...

2019-02-14 09:42:44 209

转载开发指南篇 3：合理划分容器组件与展示组件

鄙人已付费购买，粘贴出来给更多前端爱好者学习。若掘金小册禁止此类操作，请联系上篇文章我们提到了组件的概念，组件是目前模块化、组件化开发模式中必不可少的单元形式，那么除了其概念和可复用性外，我们对它的职能划分了解多少呢？本文将立足 Vue 组件的职能来谈谈我个人对于其划分的理解，唯有了解不同类型组件的职能才能编写出可维护、低耦合的前端代码。组件的职能划分如果要将 Vue 组件按照职能...

2019-02-14 09:42:26 509

转载开发指南篇 2：学会编写可复用性模块

鄙人已付费购买，粘贴出来给更多前端爱好者学习。若掘金小册禁止此类操作，请联系在生活中，重复的机械劳动会消耗我们的时间和精力，提高生产成本，降低工作效率。同样，在代码世界中，编写重复的代码会导致代码的冗余，页面性能的下降以及后期维护成本的增加。由此可见将重复的事情复用起来是提高生产效率、降低维护成本的不二之选。在 Vue 项目中，每一个页面都可以看作是由大大小小的模块构成的，即便是一行代码、...

2019-02-13 18:55:12 277

转载开发指南篇 1：从编码技巧与规范开始

鄙人已付费购买，粘贴出来给更多前端爱好者学习。若掘金小册禁止此类操作，请联系当我们完成项目的构建，进入开发阶段的时候，除了你需要了解框架本身的知识点外，我们还需要提前掌握一些项目的编码技巧与规范，在根源上解决之后因编码缺陷而导致的项目维护困难、性能下降等常见问题，为项目多人开发提供编码的一致性。本文将罗列项目中常用的一些编码技巧与规范来帮助大家提升代码质量，并会结合代码片段加强大家的理解与...

2019-02-13 18:54:38 224

转载构建实战篇 4：项目整合与优化

鄙人已付费购买，粘贴出来给更多前端爱好者学习。若掘金小册禁止此类操作，请联系前几小节，我们讲述了 Vue 项目构建的整体流程，从无到有的实现了单页和多页应用的功能配置，但在实现的过程中不乏一些可以整合的功能点及可行性的优化方案，就像大楼造完需要进行最后的项目验收改进一样，有待我们进一步的去完善。使用 alias 简化路径使用 webpack 构建过 Vue 项目的同学应该知道 alia...

2019-02-13 18:53:48 429

转载构建实战篇 3：多页路由与模板解析

鄙人已付费购买，粘贴出来给更多前端爱好者学习。若掘金小册禁止此类操作，请联系上篇文章中我们成功打包并输出了多页文件，而构建一个多页应用能够让我们进一步了解项目配置的可拓展性，可以对学习 Vue 和 webpack 起到强化训练的效果，本文将在此基础上主要针对多页路由及模板的配置进行系列的介绍。路由配置1. 跳转在配置路由前，首先我们要明确一点就是，多页应用中的每个单页都是相互隔离的...

2019-02-13 18:52:39 478

转载构建实战篇 2：使用 pages 构建多页应用

鄙人已付费购买，粘贴出来给更多前端爱好者学习。若掘金小册禁止此类操作，请联系经过对单页应用配置的了解，相信大家应该对如何构建一个 Vue 单页应用项目已经有所收获和体会，在大部分实际场景中，我们都可以构建单页应用来进行项目的开发和迭代，然而对于项目复杂度过高或者页面模块之间差异化较大的项目，我们可以选择构建多页应用来实现。那么什么是多页应用，如何构建一个多页应用便是本文所要阐述的内容。概念...

2019-02-13 18:51:27 1271

转载构建实战篇 1：单页应用的基本配置

鄙人已付费购买，粘贴出来给更多前端爱好者学习。若掘金小册禁止此类操作，请联系前几篇文章我们介绍了 Vue 项目构建及运行的前期工作，包括 webpack 的配置、环境变量的使用等，在了解并掌握了这些前期准备工作后，那么接下来我们可以走进 Vue 项目的内部，一探其内部配置的基本构成。配置1. 路由配置由于 Vue 这类型的框架都是以一个或多个单页构成，在单页内...

2019-02-13 18:49:33 695

转载构建基础篇 3：env 文件与环境设置

鄙人已付费购买，粘贴出来给更多前端爱好者学习。若掘金小册禁止此类操作，请联系在实际项目的开发中，我们一般会经历项目的开发阶段、测试阶段和最终上线阶段，每一个阶段对于项目代码的要求可能都不尽相同，那么我们如何能够游刃有余的在不同阶段下使我们的项目呈现不同的效果，使用不同的功能呢？这里就需要引入环境的概念。一般一个项目都会有以下 3 种环境：开发环境（开发阶段，本地开发版本，一般会使用一些...

2019-02-13 18:47:01 7792 1

转载构建基础篇 2：webpack 在 CLI 3 中的应用

鄙人已付费购买，粘贴出来给更多前端爱好者学习。若掘金小册禁止此类操作，请联系webpack 作为目前最流行的项目打包工具，被广泛使用于项目的构建和开发过程中，其实说它是打包工具有点大材小用了，我个人认为它是一个集前端自动化、模块化、组件化于一体的可拓展系统，你可以根据自己的需要来进行一系列的配置和安装，最终实现你需要的功能并进行打包输出。而在 Vue 的项目中，webpack 同样充当着举...

2019-02-13 18:39:58 3177

转载构建基础篇 1：你需要了解的包管理工具与配置项

鄙人已付费购买，粘贴出来给更多前端爱好者学习。若掘金小册禁止此类操作，请联系任何一个项目的构建离不开工具和统一的管理标准，在项目开发和维护过程中，我们需要了解安装包的相应工具和配置文件，以此来有效的进行项目的迭代和版本的更新，为项目提供基本的运行环境。本文将详细介绍构建 Vue.js 项目相关的依赖包安装工具和相应的配置文件，为大家提供参考。介绍相信大家对于包管理工具的使用一定不会陌生...

2019-02-13 18:35:57 374

转载开篇：Vue CLI 3 项目构建基础

鄙人已付费购买，粘贴出来给更多前端爱好者学习。若掘金小册禁止此类操作，请联系大家好，当你点进这个标题，开始阅读本章的时候，说明你对 Vue.js 是充满好奇心和求知欲的。我之前写过一篇文章，这样评价 Vue.js，称它是“简单却不失优雅，小巧而不乏大匠”的作品，正如其官网介绍的“易用，灵活和高效”那样。其实框架是 Vue.js 的本质，而真正了解它的人则会把它当成一件作品来欣赏。Vue.j...

2019-02-13 18:34:35 328

原创 js获取某一天是星期几

function oneDay(y,m,d){ var myDate=new Date(); myDate.setFullYear(y,m-1,d); var week = myDate.getDay() switch(week){ case 0: return '星期日'; case 1: ...

2018-10-29 11:00:14 5049

原创 vue中插入Echarts示例

首先，第一步下载Echarts。淘宝镜像npm install --registry=https://registry.npm.taobao.org npm install -g cnpm --registry=https://registry.npm.taobao.orgcnpm install echarts第二步，引入echarts。import echarts...

2018-09-04 10:27:19 84659 21

原创 vue点击图片预览放大（可旋转、翻转、缩放、上下切换、键盘操作）

因项目需求（ui框架element-ui），需要实现图片的点击放大，还要能旋转以及上下切换。当时第一反应，element-ui好像没有这样的组件，就想过自己写，但是那个旋转翻页上下切换感觉有点麻烦，不甘心，就在GitHub找找找.........还真找到一个适合vue的插件，叫viewerjs，GitHub地址：https://github.com/fengyuanchen/viewerjs...

2018-08-31 10:29:00 41298 47

原创一维数组转二维数组

在项目上，会遇到将一个一维数组的数据，按板块的分布排版这一类的需求。这种需求的数据往往就是数组元素中含有相同字段，以这相同字段分类即可达到需求。以以下数据为例：将let oldArr= [ { name: "一级光圆钢", type: "热轧光圆钢筋（盘卷）", material: "HPB300", specification: "Φ8", ...

2018-08-15 16:17:12 9845

原创 vue解决一个方法同时发送多个请求

在项目开发过程中，让人抓狂之一的问题就是一个点击事件，当快速点击的时候，它会重复发送多个请求。这是不允许出现的。但是怎么解决这个问题呢？一般处理方法，就是点击的时候，立刻将该按钮disabled，这样就可以避免重复发送请求了。但是我发现这个有一个弊端，那就是：如果，该事件有许多的验证，比如电话、邮箱格式是否正确呀，必填的是否填了呀等等。一旦你点击就把按钮disabled了，发现该填的没...

2018-07-20 15:36:47 28142

原创 vue+vueRouter+webpack 搭建项目

前段时间写了一篇搭建vue项目的博客，个人感觉写的不好，也不是很清晰，所以重新整理了一下，加以图片辅助，看起来应该更容易看懂。首先，确保个人已经安装了node、webpack、vue以及vue的脚手架由于国外环境下载慢，大家可以使用淘宝镜像。命令：npm install --registry=https://registry.npm.taobao.org npm install...

2018-06-25 17:10:44 1553

转载 vue的双向绑定原理及实现

前言使用vue也好有一段时间了，虽然对其双向绑定原理也有了解个大概，但也没好好探究下其原理实现，所以这次特意花了几晚时间查阅资料和阅读相关源码，自己也实现一个简单版vue的双向绑定版本，先上个成果图来吸引各位：代码：效果图：是不是看起来跟vue的使用方式差不多？...

2018-06-23 15:13:10 229

原创字体图标制作

在前端开发过程中，使用字体图标的好处既能缩小项目大小，又能随时改变颜色，不用每次修改都还得重新切图替换。下面介绍一下如何制作字体图标。首先，叫UI妹妹（也可能是抠脚大汉）给你svg格式的图像文件。比如：如果不给，打死，打死是不可能的，这辈子都不能得罪UI。也可以去阿里巴巴矢量图标库下载svg格式的图标。先加入购物车，然后选颜色大小等等，相信大家一用就会的一定要选svg。得到svg格式的图像文件后，...

2018-06-22 12:26:22 3997 1

空空如也

空空如也