小蝈蝈啊-CSDN博客

原创 Pinia（state-getters-actions）颗粒化学习笔记

Pina开始于大概2019，是一个状态管理的库（类似于Vuex、Redux），用于跨组件、页面进行状态共享,用起来像组合式API（Composition API）。

2024-01-19 11:22:33 576

原创总结之vue各方面优化

搜索引擎优化，提高网站的搜索关键词排名以及公司产品的曝光度。

2023-04-14 09:35:49 450

XSS攻击（跨站点脚本攻击），就是黑客恶意篡改你网页的前端代码，在里面注入一些恶意的 html+javascript的脚本，并在你的浏览器内运行，获取你的信息，或者进行一些恶意操作。CSRF，即 Cross Site Request Forgery，是指跨站请求伪造，是一种劫持受信任用户向服务器发送非预期请求的攻击方式。与XSS不同，XSS攻击是向受攻击网站进行脚本注入攻击，而CSRF攻击是其他网站对受攻击网站进行伪造请求。

2023-04-13 18:45:06 567

原创总结之ts篇

unknown 表示未知类型，即写代码的时候还不知道具体会是怎样的数据类型，是 typescript 3.0 中引入的新类型，与 any 类似，所有类型都可以分配给unknown 类型。never ，永不存在的值的类型，是 typescript 2.0 中引入的新类型，那什么是永不存在的类型，我们知道变量一旦声明，都会默认初始化为 undefined ，也不是永不存在的值，但其实有一些场景，值会永不存在，例如，那些总是会抛出异常或函数中执行无限循环的代码（死循环）的函数返回值类型。

2023-04-12 22:52:47 133

原创总结之webpack

默认情况下，webpack只支持对JS和JSON文件打包，像css , sass , png等这些类型的文件的时候，webpack则无能为力，这时候就需要配置对应的loader进行文件内容的解析。代码可以分出更小的bundle，以及控制资源加载的优先级，提供代码的加载性能。webpack的运行流程室一个串行的过程，它的工作流程是将各个插件串联起来，在运行过程中会广播事件，插件只需要监听它所关心的事件，就能加入到这条webpack机制中，去改变webpack的运作，使整个系统扩展性良好。

2023-04-12 22:16:18 317

原创防抖、节流

let self = this //保存this指向 if(timerId) {let canUse = true //如果为true，就触发技能，否则就不能触发 if(canUse) {fn . apply(this , arguments) //触发技能后，关闭开关 canUse = false //在3秒后打开开关 setTimeout(() => canUse = true , delay) } } }

2023-04-06 19:36:53 71

原创 vue3学习笔记

vue3 学习笔记持续更新

2023-03-27 15:25:37 1265 2

原创 vue中eventBus事件总线（$emit / $on）使用

【代码】vue中eventBus事件总线（$emit / $on）使用。

2023-01-19 16:51:48 1095

原创结合table前端自己做筛选和分页，以及根据条件设置行高亮

【代码】结合table前端自己做筛选和分页，以及根据条件设置行高亮。

2023-01-18 15:33:59 272

原创 el-select 替换右侧icon

在el-selent基础上修改右侧小图标，以及鼠标滑上input框，背景、边框颜色变更

2022-06-09 16:41:43 1615 1

原创 el-form 嵌套 el-table 增删改查并进行验证

<template><el-form :model="addJsonForm" :inline="true" label-width="108px" :rules="addJsonForm.addJsonRules" > <el-table :data="addJsonForm.tableData" border > <!-- 这里用做增删改查

2022-03-21 18:38:14 1698 1

原创 js中数组方法合集

1、查找数组中包含指定元素的个数 countNum(arr,res) { let newArrays = arr.filter((item)=>{ return item == res; }); return newArrays.length; },console.log(countNum(['1','2','1','3'] , '1')) // 2

2022-03-21 17:35:00 4042

原创 el-table 分页多选可回显

<template> <div> <el-table :data="tableData" border ref="table" style="width: 100%" v-loading="loading" element-loading-text="加载中..." @selection-change="handleSelectionChange" :row-key="k

2022-01-13 11:21:37 757

原创 momentJS 使用

npm i momentimport moment from ‘moment’;YYYY-MM-DDexport const shortTime = function (value) { return moment(value).format('YYYY-MM-DD');}YYYY-MM-DD HH:mm:ssexport const time = function (value) { return moment(value).format('YYYY-MM-DD HH:mm:

2021-12-29 11:11:21 229

原创 js对象给对象相同属性赋值

const listAssign = (arrA, arrB) => Object.keys(arrA).forEach((key) => { arrA[key] = arrB[key] || arrA[key] });demolet Obj1 = { name:"", age:0, sex:"", }let Obj2 = { name:"蝈蝈儿", age:15, sex:"男", schoo.

2021-11-25 18:15:21 1530 3

原创 vue query传参页面刷新数据不会丢失方法

onepage interest(params) { this.$router.push({ path: "/page'two", query: { params: encodeURIComponent(JSON.stringify(params)), }, }); },twopagelet paramsedit = JSON.parse(decodeURIComponent(this.$route

2021-11-25 17:53:25 423

原创 vue项目中配置测试、准生产、生产环境

开发环境：serve测试环境：stage准生产环境：pre生产环境：build在package.json,scripts中配置 "serve": "vue-cli-service serve --mode=dev --open", "stage": "vue-cli-service build --mode=stage", "pre": "vue-cli-service build --mode=pre", "build": "vue-cli-service bui.

2021-09-18 10:46:11 1573 1

原创 get 、post封装

get封装/** * get方法，对应get请求 * @param {String} url [请求的url地址] * @param {Object} params [请求时携带的参数] */ export function get(url, params) { return new Promise((resolve, reject) => { axios .get(url, { params}) .then((res) => { resolve(r

2021-09-18 10:12:52 319

原创 H5移动端配置vconsole调试工具

一、安装npm install vconsole二、引入（main.js)import Vconsole from 'vconsole'三、配置（main.js)// vue2.0版本if (process.env.VUE_APP_TITLE == 'development' || process.env.VUE_APP_TITLE == 'test') { let vConsole = new Vconsole() Vue.use(vConsole)}//vue3.0版本

2021-08-07 14:31:49 457

原创遍历数组的方法及其区别

遍历数组1、forEach方法用来调用数组的每个元素，将元素传给回调函数。优缺点：不会返回新数组;无法中途跳出循环，return或break无效；会跳过数组的空位；不会改变原始数组。 let arr = [0, ,4,6,8]; let sum = 0; const str = arr.forEach((item,index,arr) =>{ sum += item; console

2021-08-02 15:41:03 773

原创 H5移动端rem适配

npm i postcss-pxtorem@5.1.1 --save //这个要装5.1.1版本的，高版本会报错。

2021-07-30 15:06:57 563 1

原创利用canvas把文本和图片结合到一起展示成一张图片在页面展示出来

利用canvas把文本和图片结合到一起展示成一张图片在页面展示出来canvas 使用方法见mdncanvas使用方法主要思路 ## 在html中创建<img> 和 <canvas> 两个标签，<img>初使状态为display:none； <canvas>始终为display:none；紧接着用js去画图，把原始图片和文本结合起来，会返回一个bease64格式的超链接，把超链接地址直接复值给img标签，复制完毕之后设置img标签为display:t

2021-07-30 11:42:22 1375 4

原创判断是android 还是 ios

// 判断是安卓还是ios appSource() { const u = navigator.userAgent; const isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); if (isiOS) { return "ios"; } else { return "android"; } },//判断是微信还是微博let ua = n..

2021-07-30 11:15:57 144

north_katydid的博客