自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(33)
  • 收藏
  • 关注

原创 jest 单元测试入门

中文官网:1. 安装命令行2. package.json 中配置3. 运行或者4. 测试文件后缀需要为或者5. 需要有两个必会的方法test :Jest封装的测试方法,一般填写两个参数,描述和测试方法expect :预期方法,就是你调用了什么方法,传递了什么参数,得到的预期是什么。

2024-07-29 14:25:06 376

原创 React 相关

redux 是 react 开发时,一种状态管理工具,再开发时,可以将一些方法和数据包括请求之类的封装,再整个项目都可以调用。当前路由对应的 path type = String。公共数据存储 type = Object。当前路由对应的 name type = String。数据存放 例如:字段富化对象,表格对应数据等。子组件,用于放置 index.jsx 中各个组件。处理模块 type = Object。redux 相关,公共字段,接口请求和处理等。首页 默认进入的页面。

2023-12-08 17:16:11 1017

原创 vue进阶 Iframe基础

Iframe 在同域时能自由操作iframe和父框架的内容(DOM),在跨域时可以实现页面跳转。iframe.contentDocument, 获取iframe的document对象。iframe 接受 vue 的值 建议写在 mounted 和 created 中。iframe.contentWindow, 获取iframe的window对象。iframe 路径 建议写在 mounted 中,可以设置路径和参数。vue 监听 iframe 传过来的值。template 引入。

2022-11-18 16:01:32 5931 1

原创 nodeJs针对文件、文件夹的操作

目录fs 读取操作文件引入与注意事项增fs.writeFile() 覆盖fs.appendFile() 追加fs.mkdir() 文件夹删fs.rm() 删除文件fs.rmdir() 删除文件夹改fs.rename() 查fs.exists() 判断文件或目录是否存在,返回bool值fs.readdir() 读取目录下的所有文件和子目录fs.readFile() 读取文件compressing 压缩、解压文件安装与引用使用压缩单个文件压缩文件夹解压文件解压含有中文名的文件引入注意事项1 添加后缀 s

2022-06-08 11:41:27 2769

原创 Echarts与LCharts

目录多颜色时设置richlcharts 设置 beforeRender 函数多颜色时设置richformatter: function (item) { if (item.data.name == '被攻击的企业') { return "{a|" + item.data.name + "}\n\n{c|" + item.data.value + "}" } else { return "{b|" + item.data.name + "}\n\

2022-04-06 11:29:38 1572

原创 TypeScript基础

目录TS命令行TS数据类型布尔值 Boolean数值Number 字符串String 数组 Array 元祖 Tuple对象 Object联合类型类型推论任意类型 Any没有类型 Void永不存在的值的类型 Nerver不确定的变量unknown接口约束函数TS命令行安装ts 小黑框管理员身份安装npm install -g typescript生成对应js文件tsc my.ts 生成ts...

2022-03-02 16:53:10 619

原创 前端微信小程序面试题总结

页面的基本配置 backgroundColor 下拉刷新的背景色,下拉刷新的部分才是背景 backgroundTextStyle 小程序的背景文本样式只有light浅色和dark深色两个值 navigationBarBackgroundColor 导航条的背景色 navigationBarTitleText 导航条...

2022-02-18 18:33:22 1622

原创 搭建vue3脚手架的vite和npm方式

安装vue3最新版本的vue-cli卸载旧版npm uninstall vue-cli -g 或yarn global remove vue-cli安装新版本 @vue/clinpm install -g @vue/cli 或yarn global add @vue/cli//检查vue版本号vue -V搭建vue3最新脚手架web方式搭建 与旧版本步骤一致 可在安装时,选择配置项npm create myappvite方式搭建..

2022-02-18 11:38:37 1509 1

原创 vue脚手架中创建一个node服务器

通过node创建服务器1 在src同级的位置,创建server文件夹,用来放置node服务器2 打开server文件夹的终端,输入 npm i 初始化3 初始化完成后,输入npm i express -S 命令行4 将打包完成后生成的 dist 文件夹放入server文件夹5 在server文件夹中,创建 app.js ,并输入以下代码const express = require('express')const app = express()app.use(expr...

2022-02-17 15:03:38 1102

原创 解决vue跳转同一路由报错问题

vue中,如果跳转同一个页面路由,虽不会影响功能,但是会报错原因:路由的push会向历史记录栈中添加一个记录,同时跳转同一个路由页面,会造成一个重复的添加,导致页面的报错解决方案:在router的index.js中重写vue的路由跳转pushconst originalPush = Router.prototype.pushRouter.prototype.push = function push(location) { return originalPush.call(thi..

2022-02-07 11:26:44 2416

原创 如何开启phpStudy服务器

需要的软件phpStudy 用来导入一个数据库api-server 数据库功能1 可以开启一个服务器,让开发环境可以使用生产环境的网址请求1 安装 phpStudy 并导入数据库1 双击phpStudy软件 ,以管理员身份运行,将会弹出以下内容2 按照上图输入,3 还原的数据库名为 mydb4 选择要还原的文件为 直接复制粘贴即可5 点击导入2 开启服务器1 进入api-server文件夹,输入cmd开启终端2..

2022-01-22 11:21:20 2450

原创 前端JS面试题总结

什么是JS ECMAScript JS的基本语法 DOM 文档对象模型,操作页面元素,顶级对象 document BOM 浏览器对象模型,顶级对象 window 构造函数的原型,原型链,prototyoe: 每个构造函数里都有一个prototype属性,称为显示原型__proto__: 每个实例化对象都有一个__proto__属性,称为隐式原型constructor:每个prototype原型都有一个constructor...

2022-01-14 15:46:14 1073

原创 nginx小型服务器的使用

Nginx (engine x) 是一个高性能的HTTP和反向代理服务器,也是一个IMAP/POP3/SMTP服务器。是一种轻量级的Web服务器,可以作为独立的服务器部署网站。它高性能和低消耗内存的结构受到很多大公司青睐,如淘宝网站架设。。windows系统1 安装http://nginx.org/en/download.html2 下载后解压,注意:名称不能有中文3 在上图的页面。打开控制台,输入指令开启,然后在浏览器页面输入localhost默认端口为...

2022-01-14 10:59:40 1072

原创 原生js封装一个ajax请求

<script> window.onload = function(){ var oBtn = document.getElementById('btn'); oBtn.onclick = function(){ //1.创建ajax对象 //只支持非IE6浏览器 var oAjax = null; if(window.XMLHttpRequest){ oAjax = new XMLHttpRequest(); //alert(new .

2022-01-12 15:06:46 213

原创 前端VUE面试题总结

目录VUEXVUEX什么是vuexVuex:是vue的状态管理工具,就是管理公共数据的,这个数据在任何组件都能使用vuex的持久化数据安装插件npm i vuex-persistedstate --save在store/index.js 中引入import vuexPersist from "vuex-persistedstate"配置plugins:[newvuexPersist({ storage:window.localStora...

2022-01-11 11:25:45 1094

原创 适配vue的时间处理插件

因为后台返回的时间数据的不同,我们可以自己设置filters来过滤时间格式,同时也可以用这个插件来设置一个格式化,将数据转换为对应格式插件的安装npm i dayjs --save创建day.js文件进行配置引入// 引入import dayjs from 'dayjs'// 引入其中的相对时间 例一天前,五秒前import rTime from 'dayjs/plugin/relativeTime'// 全局使用中文dayjs.locale('zh_cn')

2022-01-10 19:16:30 668

原创 省市区选择的三级联动插件的使用

注意:该方法只能用在vue的脚手架项目中安装npm安装npm install v-distpicker --saveyarn安装yarn add v-distpicker --save注册main.js注册全局组件import VDistpicker from 'v-distpicker'Vue.component('v-distpicker', VDistpicker);在使用的vue组件里注册import VDistpicker from 'v-d

2022-01-08 15:59:13 925

原创 vuex的分模块化与辅助函数

目录分模块化怎么分模块模块化后,在vue组件里的使用vuex的辅助函数都有什么辅助函数默认为vuex的index.js的辅助函数引入注意事项:两种遍历方式分模块后的使用辅助函数需引入一些数据使用方法 除命名外,其他遵循以上规则分模块化怎么分模块1 在vuex的store文件夹里添加一个js文件,内容如下export default {// 代表这是一个命名独立的空间,不会与index.js里的命名冲突与污染namespaced:t...

2022-01-07 10:37:33 1063 1

原创 前端HTML&CSS面试题总结

HTML&CSS盒模型在我们HTML页面中,每一个元素都可以被看作一个盒子,而这个盒子由:内容区(content)、填充区(padding)、边框区(border)、外边界区(margin)四部分组成标准盒模型 (非IE浏览器)box-sizing:content-box;一个块的总宽度(页面中占的宽度)= width + margin(左右) + padding(左右) + border(左右)怪异盒模型 (IE浏览器)box-sizing:border-box

2022-01-05 19:47:32 678

原创 全局路由守卫的应用

前置路由守卫 router.beforeEach判断页面是否需要登录1 在路由中设置meta isToken用来判断是否需要登录才能进入的页面{ path: '/login', name: 'login', component: () => import('../views/Login.vue'), meta: { title: '登录', isToken: false }, },2 前置守卫判断router.

2022-01-05 13:34:33 464

原创 svn的简单使用

什么是svn自由/开源的版本控制系统,管理着随时间改变的数据。数据放置在一个中央资料档案库中。会记住每一次文件的变动。 这样你就可以把档案恢复到旧的版本, 或是浏览文件的变动历史。用于多个人开发一个共同的项目,达到合作开发的目的svn的安装下载地址 :https://sourceforge.net/projects/win32svn/具体安装过程 :https://www.runoob.com/svn/svn-install.htmlsvn的一些概念reposi.

2022-01-03 18:50:37 219

原创 移动端的vw vh适配

什么是vw vh属于一种新兴的移动端布局配置,功能与rem类似vw 视口的最大宽度,1vw等于视口宽度的百分之一vh 视口的最大高度,1vh等于视口高度的百分之一如何自动适配vw vh安装依赖npm install postcss-px-to-viewport -D修改 .postcssrc.js// https://github.com/michael-ciniawsky/postcss-load-configmodule.exports = {

2021-12-31 15:43:57 273

原创 多环境变量

一个项目的产出过程1 客户拥有需求,并寻找公司制作2 公司接单,并交于产品经理制作原型图3 原型图制作完成后,与客户确认4 交于ui进行项目设计5 设计完成,前后端开始工作,制作页面与后台数据6 身为前端,如果一开始没有后台数据的情况下,可以使用json进行后台数据模拟7 最后,前后端共同调试,当然,一开始就有数据的情况下,前端在工作时就需调试完成8 项目完成,交于测试,改bug9 测试通过后上线,一个项目完成环境变量都有什么开发环境 developmen

2021-12-30 15:52:51 385

原创 webpack配置与打包优化

什么是跨域浏览器,端口,域名有一项不同就会产生跨域解决跨域先在vue脚手架的根目录下创建 vue.congif.js 文件vue的脚手架会自动进行webpack配置,而vue.congif.js 文件就是进行修改默认的该配置的配置的思路创建vue.congif.js 文件,里面的devServer 是进行开发环境的服务器配置的,里面有proxy是用来进行代理的转发,在proxy里的 target 设置转发的网址跨域转发因为跨域的问题,axios是无法请求...

2021-12-30 10:52:16 2208 1

原创 Linux 命令

查看文件/目录 ls 显示当前的工作目录 pwd 进入目录 cd 创建目录 mkdir 删除空目录 rm -d dirname 要删除非空目录 rm -r dirname 显示文件至标准输出 cat 拷贝 cp 移动 mv 创建文件 touch 编辑 vi 保存并退出 wq 更多linux 指令参考:https://www.cnblogs.com/frankliiu-java/artic.

2021-12-30 07:43:11 560

原创 uni-app写微信小程序时的封装api

小程序的封装请求需要返出一个promise// http请求封装export default function http({ url, method = "get", data = ''}) { // 开启loading uni.showLoading({ title: '拼命加载中...', mask: true }) return new Promise((resolve, reject) => { uni.request({

2021-12-26 19:50:28 337

原创 vue的封装网络请求api模块

server.js文件引入与创建axios实例// 引入axiosimport axios from 'axios';// 创建axios实例const server = axios.create({ baseURL: 'https://api.it120.cc', //整个项目的默认地址 timeout: 5000, //请求超时时间的设置});请求拦截可以进行请求头设置,load...

2021-12-26 19:09:18 372

原创 git的简单操作

目录什么是gitgit的基本工作流程git的基础命令git的远程仓库命令什么是gitgit是版本管理工具,它可以将文档的更新记录保存下来,也可以在任意时间进行恢复是进行团队开发的重要工具git的基本工作流程在工作区编写代码,然后将数据存入暂存区,在暂存区提交数据至本地仓库或远程仓库注意:提交仓库时的描述要详细,已便于后续的修改更加简单git的基础命令 初始化一个本地仓库 gitinit ...

2021-12-25 11:47:27 538

原创 v3的一些小方法

单文件组件< script setup >< script setup > </script> 可以直接引入,定义,逻辑,无需return返出数据直接import引入子组件后在页面直接使用,无需注册替代props功能的是: defineProps({})替代emit功能的是:defineEmits([])点击的dom上@click="skip"例:cons...

2021-12-22 20:35:58 2061

原创 js的一些简单方法

滚动事件@scroll开启滚动事件如何判断滚动到了底部 事件对象e里解构 const{scrollTop,clientHeight,scrollHeight}=e.target;当 scrollTop+clientHeight+1 > scrollHeight时代表滚动到了底部拖拽//定义元素letson=document.getElementsByClassName("my-card")[...............

2021-12-22 20:33:21 683

原创 数组 字符串 对象的常用方法

数组数组去重 只适用于简单数据data=[...newSet(data)]数组合并第一种:let arr1 = arr1.concat(arr2,arr3)第二种: [...arr1,...arr2,...arr3]将循环返回的数据放在一个新数组中data.map(item=>item.name)pop()数组末尾删除返回数组中被删除的元素shift()数组头部删除返回值是数组中被删除的元素push()数组末尾添加 ......

2021-12-22 20:31:33 753

原创 Vue 组件库的使用注意

注意:以下内容本人只在v3中实现过,如果是v2,请自行测试Form组件提供了表单验证的功能,只需要通过rules属性传入约定的验证规则,并将form-Item的prop属性设置为需 form 绑定值对应的字段名即可而如果自定定义使用正则,以下使用上图的email为例因为表单只是做了验证,没有实现,验证失败后,自动终止发送功能所以 上图使用了isSkip变量来判断是否可以进行登录或注册等下一步操作......

2021-12-16 19:35:34 885

原创 移动端的rem适配

vue中使用vant的rem适配 如果需要使用rem单位进行适配,推荐使用以下两个工具:postcss-pxtorem是一款 PostCSS 插件,用于将 px 单位转化为 rem 单位 lib-flexible用于设置 rem 基准值安装命令npm install postcss-pxtorem --save-devnpm i -S amfe-flexible新建一个postcss.config.js文件配置设计稿module.exports = {...

2021-12-16 19:15:15 2443

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除