- 博客(39)
- 收藏
- 关注
RSS订阅原创 vue3格式校验邮箱和手机号
vue3格式校验邮箱和手机号这里写自定义目录标题 <q-input outlined dense :rules="[ (val) => val != null || val?.trim() !== '' || '邮箱不能为空', val=>/^[0-9a-zA-Z_.-]+[@][0-9a-zA-Z_.-]+([.][a-zA-Z]+){1,2}$/.test(val)|| '请输入正确的邮箱格式' ]" v-
2022-05-11 15:51:50
2622
原创 vue中使用Cesium——第一个Cesium页面
vue中使用Cesium——第一个Cesium页面一 前言市面上的前端框架中，Vue+Cesium 可谓是最佳搭档，一般做 Cesium B 端产品的公司都会使用 Vue，所以后续内容都将基于 Vue。想要在Vue中使用Cesium，我推荐使用 vue-cli-plugin-cesium，原因就是配置简单。具体的安装过程可以点击链接查看。二 初始化安装完vue-cli-plugin-cesium插件后，我们就可以写自己的cesium页面了。 首先定义一个div，id为cesiumContainer.
2021-11-08 10:24:16
3397
原创 React快速暴力入门（四）
React快速暴力入门（四）一.了解与使用 react-redux前面也说了，react-redux 其实就是 redux的升级版，对许多地方进行了优化，但在学习他之前，需要我们进行一些对 redux的优化知识。1. 使用容器组件和UI组件其目的就是为了把组件身上太多的活进行拆分，分为UI组件（内组件）和容器组件（外组件），两个组件之间使用 props进行通信，对 store那边的请求状态，更改状态的活交给容器组件来干，而通过状态来编写页面，更新渲染等活，就交给 UI组件来干。了解了这个后，就可
2021-07-30 19:43:45
173
原创 React快速暴力入门(三)
React快速暴力入门(三)一.组件列表渲染、条件渲染与DOM的Diffing算法1. 组件列表渲染在有时候我们需要批量的去创建一些DOM元素或组件，比如页面上的：新闻列表、推文列表、好友列表等等，你会发现在开发的过程中经常会使用到列表，但是自己一个个的去写DOM回十分繁琐。我们可以通过数组存储数据，也可以使用数组来循环渲染数据。举个例子：class Demo extends React.Component{ state = { arr: [a, b, c], }
2021-07-29 18:54:05
203
原创 React快速暴力入门(二)
React快速暴力入门(二)1.组件的三大属性组件的实质就是个对象，而对象自然有属性，在组件里最常用的三个属性分别是 state、props和 refs(上期呢我们已经讲过state了 有需要的可以去上一个博客看哦)1. props与 state不同，state是组件自身的状态（数据），而 props则是外部传入给自己的状态（数据）props在组件内修改，必须由谁传入的即由谁修改类式组件中使用class Person extends React.component{ construc
2021-07-27 15:47:16
199
1
原创 React快速暴力入门
React快速暴力入门React 作为如今三大框架之一，在进行了短期的学习后，整理了一些笔记，做一下分享：，如果有错误，欢迎指出。1. 什么是React：React 是一款由 Facebook开发的用于构造用户界面的Javascript库。React 与Vue相比，vue的语法简单易上手，适用于小而精的项目，但是 React在组件上的复用性与设计性上会胜于vue一筹，适用于大型的项目。React 将页面以一个个组件的方式进行拆分与组装，重复使用提高效率（可见下图）React 对数据的处理与管理比
2021-07-26 21:05:50
207
原创 Vue3入门指南-基础用法
Vue3入门指南-基础用法终于 Vue3 的正式版发布了，两年多的开发，多位贡献者的努力。凝聚了这么多优秀开发者的智慧和努力，注定 Vue3 会成为下一个前端主流开发框架。本篇文章将带领大家一步步学习和了解使用vue3,当然更多的是我的学习过程。前端就是这样，要时刻保持学习，每个月都有新技术的产生。如果每个知识都学，显然不现实，所以也要有选择性的学习。例如现在主流的三大框架，Vue/React/angular, 基于这三大框架的扩展框架我都应该有所涉及和了解。有的小伙伴这时候会说，我们公司还没开始使
2021-07-02 20:31:44
807
原创 TS in JS 实践指北
TS in JS 实践指北1.写在前面2.作用原理2-1.VSCode 里的 TS2-2.JS 里的 TS3.优雅的头文件3-1.内置声明文件3-2.包内自带的声明文件3-3.来自 @types 的声明文件3-4.应用:使用 .d.ts 声明文件拓展 type 能力4.神奇的注释4-1.JSDoc4-2.别瞎用不知道有多少 TS 爱好者哀叹过这个问题：虽然我很想用 TS，奈何老大只让用 JS。今天我，告诉你，在 JavaScript 中也可以很流畅的使用 TypeScript ，而且你的老大不会找你的麻
2021-07-01 17:53:53
246
1
原创 TypeScript安利指南
TypeScript安利指南1.前言2.安利3.应用场景3-1.用我的代码就要听我的3-2.找文档3-3.粗心大意3-4.隐藏的问题3-5.接口数据不知道3-6.增强后的class和enum4.优点以及不足5.ts在js中的玩法5-1.配置文件自动提示5-2.js语法检查6.写在最后1.前言据了解，目前有相当一部分同学不想去学习ts，毕竟没(xue)时(bu)间(dong)。很不幸两个月前我也是其中的一员。在看到尤大大都用ts写vue3了，蠢蠢欲动的我小心翼翼的踏入了这个深坑。在经历了长达一天的摸爬滚打
2021-06-30 16:29:25
314
1
原创 uni-app的基本使用
uni-app的基本使用1.uni-app介绍2.为什么要学习uni-app?3.环境搭建4.初始化项目5.运行项目6.介绍项目目录和文件作用7.全局配置和页面配置8.text组件的用法9.view视图容器组件的用法10.button按钮组件的用法11.image组件的使用12.uni-app中的样式13.uni-app中的数据绑定14. 插值表达式的使用15.v-bind动态绑定属性16.v-for的使用17.uni中的事件18.uni的生命周期19.总结1.uni-app介绍uni-app 是一个使
2021-06-29 20:53:18
622
1
原创 前端面试（2）
前端面试（2）我们在上文也说了 今天呢我又面了一家 基本上都是基础题 大家看完以后记得自己私下也要背背哦1.如何区分html和html5?1、在文档声明上，html有很长的一段代码，并且很难记住这段代码，都是靠工具直接生成，而html5却是不同，只有简简单单的声明，也方便人们的记忆，更加精简。2、在结构语义上；html4.0没有体现结构语义化的标签，这样表示网站的头部。html5在语义上却有很大的优势。提供了一些新的html5标签。2.常用的浏览器有哪些 内核是什么？1、360浏览器：Chrom
2021-06-28 17:37:20
132
原创 前端面试题（小白必看）
在我们日常生活中，不管什么行业都是需要面试的 在这里呢 我会为大家更新一下前端面试题 这个行业在现在这个时代是很流行的我为大家准备了二十道面试题1.页面元素隐藏方式 和各自特点？第一种：display属性为none，效果：元素不显示，不占位第二种：设置css visibility属性为hidden，效果：元素不显示，但占位2.用过哪些盒模型？标准盒模型（W3C盒子模型），设置的width或height是对 实际内容（content）的width或height进行设置，内容周围的border和pad
2021-06-26 13:56:15
521
1
原创 微信小程序（3）
1.应用生命周期今天我们来学一下生命周期 我把生命周期分为两种 应用生命周期和页面生命周期 接下来我会为你们一一讲解我们先开始讲解应用生命周期 这样方便我们在后期开发中知道每个属性都是在哪里用的1.onLaunchapp.js代码：打印台：这个意思就是我们打开应用的时候就会触发的一个事件 他一般适用于应用第一次启动的时候 获取个人的用户信息2.onShowapp.js代码：打印台：这个也是一进页面就打印了 但是onLaunch比他先执行 这个主要讲的是对应用的数据或者页面效果重置
2021-06-24 16:28:44
240
1
原创 微信开发者⼯具介绍及基本使用（2）
微信开发者⼯具介绍及基本使用（2）1.常⻅组件1.常⻅组件重点讲解⼩程序中常⽤的布局组件:view, text , button,image,navigator,icon,swiper,radio,checkbox。 text,button,image,navigator,icon,swiper,radio,checkbox。等
2021-06-23 10:03:41
1087
1
原创 微信开发者⼯具介绍及基本使用（1）
微信开发者⼯具介绍及基本使用（1）1.第⼀个微信⼩程序1.打开微信开发者工具2.新建⼩程序项⽬3.填写项目信息4.成功2. 微信开发者⼯具介绍3.小程序结构目录1.小程序文件结构和传统web相比2. 基本的项⽬⽬录4.小程序配置文件1.全局配置app.json2.页面配置3.sitemap配置-了解即可5.模板语法1.数据绑定1.第⼀个微信⼩程序1.打开微信开发者工具注意 第⼀次登录的时候 需要扫码登录2.新建⼩程序项⽬3.填写项目信息4.成功2. 微信开发者⼯具介绍详细的使⽤，可以
2021-06-21 15:49:53
17567
3
原创 微信小程序介绍和注册登录
微信小程序介绍和环境准备1.什么是微信小程序？2.为什么是微信小程序？3.微信小程序历史4.疯狂的微信小程序5.还有其他的小程序不容忽视6.体验7.环境准备8.注册账号9.获取APPID10.开发工具11.总结1.什么是微信小程序？微信小程序，小程序的一种，英文名Wechat Mini Program，是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用。2.为什么是微信小程序？1.微信有海量用户，而且粘性很高，在微信开发产品更能触达用户2.推广App
2021-06-21 09:23:42
574
原创 webpack打包js
webpack打包js1.安装js插件2.在配置文件中配置内容3.测试浏览器是否都能使用4.测试promise5.打包js的格式校验6.安装格式校验的插件7.配置文件引入8.校验成功9.解决校验的方法10.总结1.安装js插件npm i -D babel-loader @babel/D babel-loader @babel/core @babel/preset-env 2.在配置文件中配置内容我们可以看到我们在配置文件中可以看到我们配置了这些内容3.测试浏览器是否都能使用我们在这里写了
2021-06-15 18:50:18
219
原创 webpack打包html
打包1.生产环境与开发环境的区别2.打包html1.生产环境与开发环境的区别你们肯定也很好奇生产环境(production)与开发环境(development)的区别吧sh这个是我们的生产环境 他打包好编译出来的代码只有我们自己写入的一些代码而开发环境出来的呢就会有很多注释 当然这些注释是给我们自己看的2.打包htmlnpm i html-webpack-plugin -D首先我们先在终端安装这个插件然后我们需要在我们的配置文件中引入我们的插件然后我们还是在我们的配置文件的最下方
2021-06-15 16:55:09
2331
原创 webpack打包css
webpack打包1.打包css2..打包逻辑1-1.webpack打包css逻辑3.打包css4.打包成独立的css文件5.添加样式前缀6.格式校验7.压缩css8.我们为什么要用这个打包工具呢9.webpack的打包顺序10.总结1.打包css2…打包逻辑1-1.webpack打包css逻辑 非js文件打包 需要对应的loader css-loader将css转化为js style-loader把包含css内容的js代码 挂载到页面的<style>标签 引入css（import
2021-06-11 18:09:29
2047
3
转载 1小时入门，手把手教你学会用webpack打包
webpack打包1.打包css1-1.非js文件打包 需要对应的加载器（loader）1-2.引入css(import "./css/main.css")1-3.安装（npm i css-loader style-loader -D）1-4.配置2.打包html3.打包js4.打包图片5.打包字体6.资源模块（Asset Modules）7.开发服务器（Dev Server）1.打包css1-1.非js文件打包 需要对应的加载器（loader） - css-loader将css转化为js(将cs
2021-06-11 16:07:16
191
原创 webpack的安装和基本使用
webpack的安装和基本使用1.webpack是什么？2.webpack安装3.webpack的五个核心概念3-1.Entry3-2.Output3-3.Loader3-4 Plugins3-5 Mode4.webpack的初体验4-1.初始化 package.json4-2.下载并安装 webpack5.编译打包应用5-1.创建文件5-2. 运行指令5-3.结论5-4.问题6.创建项目7.安装 webpack8.a.js9.使用 webpack 命令打包10.index.html11.打开index.h
2021-06-10 14:49:59
154
原创 github注册和基本使用
github注册和基本使用1.github2.注册1.访问[github](https://github.com/)首页 点击sign up连接（注册）1.github在版本控制系统中 大约90%的操作都是在本地仓库中进行的 暂存 提交 查看状态或者历史记录等等 除此之外 如果只有你自己在这个项目里工作 那么你就没有机会需要设置一个远程仓库只有当你和你的团队共享数据时 设置一个远程仓库才有意义 你可以把它想象成一个“文件管理服务器”利用这个服务器你就可以与其他成员进行数据交换2.注册1.访问git
2021-06-09 17:11:26
285
原创 git的指令
git指令1.撤销1-1 用暂存区的文件覆盖工作目录的文件1-2 将文件从暂存区中删除1-3 将git仓库中特定的更新记录更新出来并且覆盖暂存区和工作目录2.清除屏幕3.分支1.撤销我们上期也说过了git的一些指令在这里呢我为继续为大家更新新的指令我们打开项目以后 自己创建一个文件夹 此时我们可以看到list.html是一个红色的我们需要把他添加到暂存区git add ‘自己的创建的文件名’ 这个指令可以让我们新创建的文件夹存到了暂存区此时我们在用git status来查看状态 我们会发现我
2021-06-08 15:27:56
83
原创 git基本使用和介绍
Git基本使用和介绍git简介版本控制？什么是版本控制？为什么要使用版本控制?git和svn的区别集中式（svn）分布式(git)回滚的解释git的安装git的基本指令1.查看版本号2.初始化文件的每个详情3.用户信息4.文件列表 追踪文件5.查看文件状态6.向仓库提交代码怎么查看自己有没有成功总结git简介Git 是一个开源的分布式版本控制系统，用于敏捷高效地处理任何或小或大的项目。Git 是 Linus Torvalds 为了帮助管理 Linux 内核开发而开发的一个开放源码的版本控制软件。G
2021-06-07 20:33:21
117
原创 防止js全局变量污染方法总结
javaScript 可以随意定义保存所有应用资源的全局变量。但全局变量可以削弱程序灵活性，增大了模块之间的耦合性。在多人协作时，如果定义过多的全局变量 有可能造成全局变量冲突，也就是全局变量污染问题,以下是两种解决办法一.定义全局变量命名空间只创建一个全局变量，并定义该变量为当前应用容器，把其他全局变量追加在该命名空间下...
2021-06-03 16:19:27
1640
1
原创 animation动画
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> #box { width: 200px; height: 200px; margin: 0 auto; c.
2021-06-03 15:33:06
104
原创 评论发表之屏蔽关键字
在生活中我们在评论内容时 敏感字会自动成**这是因为我们在代码上加了一点限制<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> #wrap{ width:600px; height:600px;
2021-06-03 14:58:53
603
原创 css强制样式
在我们日常写代码中，我们偶尔会遇到一个问题，就是我们的样式上不去，明明写了样式就是看不到效果，这时候我们就会检查我们的代码是否写错，但看来看去就是没问题 此时就有可能是我们的样式权重不够这时我们只需要zau...
2021-06-03 13:50:14
2069
原创 js常用的循环遍历你会几种
前言数组和对象作为一个最基础数据结构，在各种编程语言中都充当着至关重要的角色，你很难想象没有数组和对象的编程语言会是什么模样，特别是 JS ，弱类型语言，非常灵活。本文带你了解常用数组遍历、对象遍历的使用对比以及注意事项。数组遍历随着 JS 的不断发展，截至 ES7 规范已经有十多种遍历方法。下面按照功能类似的方法为一组，来介绍数组的常用遍历方法。for、forEach、for …ofconst list = [1, 2, 3, 4, 5, 6, 7, 8,, 10, 11];for (let
2021-05-26 21:34:21
147
原创 vscode的一些常用插件
vscode的常用插件在日常生活中，VisualStudio Code是一款流行的编辑器，理由之一也是因为它有很多扩展，可以提高开发的效在本文中开发人员都应该了解的2款VSCode扩展。Auto Rename TagAutoRename Tag是一款面向Web开发人员的VSCode扩展。顾名思义，Auto Rename Tag可以在一个标签更改时自动更新另一个标签：Bracket Pair Colorizer这款扩展可以将匹配的括号染成相同的颜色。同一个文件内嵌套的组件、函数、对象等带来的大量
2021-05-25 10:43:43
135
原创 双向数据绑定
双向数据绑定1. vue双向数据绑定是通过 数据劫持，并结合 发布-订阅模式的方法来实现的，也就是说数据和视图同步，数据发生变化，视图跟着变化，视图变化，数据也随之发生改变2. 核心：关于vue实现双向数据绑定，其核心是Object.defineProperty()方法3. 介绍一下Object.defineProperty()方法1.Object.defineProperty(obj,prop,descriptor)这个语法内有三个参数，分别是obj（要定义其上属性的对象） prop （要定义或修
2021-05-24 21:13:36
83
原创 axios 跨域请求详情
axios 跨域请求详情写这篇文章的背景是因为之前遇到的，在跨域的情况下通过 axios 发起的 get 请求正常，post 请求会在正式请求发送之前先发送一个 opstions 请求，而后端接口没有兼容 options，导致 404 的情况。而在解决这个问题时带着好奇心顺带查了一下，给自己补充了些知识点跨域请求分两种简单讲，从 JavaScript 代码发起的 XMLHttpRequest 请求可以分为两种：不会触发CORS预检的请求，而是直接向服务端发送请求，什么是 CORS预检 咱们后面
2021-05-24 20:22:07
2517
1
原创 vue 面试题
vue 面试题 经常会被问到的面试题1.vue优点答：轻量级框架：只关注视图层，是一个构建数据的视图集合，大小只有几十kb；简单易学：国人开发，中文文档，不存在语言障碍 ，易于理解和学习；双向数据绑定：保留了angular的特点，在数据操作方面更为简单；组件化：保留了react的优点，实现了html的封装和重用，在构建单页面应用方面有着独特的优势；视图，数据，结构分离：使数据的更改更为简单，不需要进行逻辑代码的修改，只需要操作数据就能完成相关操作；虚拟DOM：dom操作是非常耗费性能的， 不再
2021-05-20 16:17:17
177
原创 数组去重的n种办法
在我们实际开发中我们也会遇到很多数组去重的问题，我总结了一些数组去重的多种方法1.将数组的每一个元素依次与其他元素做比较，发现重复元素，利用数组方法splice()删除重复元素 var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5,5,5,5]; function norepeat(arr) { for(var i = 0; i < arr.length-1; i++){ for(var j = i+1; j <...
2021-05-20 15:33:26
130
原创 js数据类型有几种
判断js中的数据类型有一下几种方法：typeof、instanceof、 constructor、 prototype、 $.type()/jquery.type(),接下来主要比较一下这几种方法的异同。先举几个例子： 1 2 3 4 5 6 var a = "iamstring."; var b = 222; var c= [1,2,3]; var d = new Date(); var e = f
2021-05-17 21:30:34
202
原创 JS隐式数据类型转换
隐式数据类型转换显式转换：程序员主动调用语法去转换数据类型，语义更加明确隐式转换：运算符两边数据类型不一致，编译器自动帮我们转换一致在计算，这是js的语法特点隐式转换1.转成string类型：+号两边如果有一边是字符串，则会把另一边转换成字符串，然后进行拼接2.转成number类型：以下几种运算符会将任何数据转换成number类型再运算，如果无法转换则为NaN数学正号 ： +num当 +/-号写在一个变量名的前面，此时表示数学的正/负数自增自减（++ --）算术运算符（+ - * /
2021-05-17 21:23:21
283
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人