- 博客(136)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 【自学向】什么是Web3.0?
web2.0存在的问题：用户行为产生了大量的数据，但这些数据的特点是“存储即拥有”，而非“谁创造谁拥有”，用户的数据完全由中心化的公司掌控（尤其各大互联网公司），数据都存在各个公司的服务器上，导致许多问题：互联网公司凭借手机的数据和利用数据的优势，在财力上变得“富可敌国”，同时也存在数据隐私泄露、数据丢失、封号、大数据杀熟、游戏停服等等问题（巨头掌控的格局），他们所展示出来的私人立场与公众利益的冲突也愈发严重（生活被互联网公司绑架）于是催生了web3.0。
2023-03-21 22:56:12
598
1
原创 对象数组按照对象的某个属性排序
源数据 let originalArr = [ {rank:1,name:'Matt'}, {rank:3,name:'Andy'}, {rank:5,name:'Ted'}, {rank:2,name:'Jim'}, {rank:4,name:'Peter'}, ];按照rank属性排序（升序排序） let res = []; originalArr.forEach((item,index)=>{ res[item.rank - 1
2021-09-06 15:45:20
334
原创 自定义组件的v-model
在项目中会遇到很多，组件需要双向绑定，使用组件的时候绑定v-model1、封装一个radioRow<template> <div class="check-box-container"> <div class="check-box-title"> 产品选择 </div> <div class="content"> <template> <el-radio-g
2021-09-03 11:55:28
276
转载 常见js优化技巧
文章转自公众号：前端潮咖 https://mp.weixin.qq.com/s/K65x6_SmdCRCPlyXpvxb7g1.带有多个条件的if语句把多个值放在一个数组中，然后调用数组的 includes 方法。//longhandif (x === 'abc' || x === 'def' || x === 'ghi' || x ==='jkl') { //logic}//shorthandif (['abc', 'def', 'ghi', 'jkl'].includes(x))
2021-07-29 15:13:58
118
原创 vue marquee 思路总结（附具体代码）
需求：项目中需要做一个通知的跑马灯，试了很多方案，最后用了下面这种，感谢大佬的博客原博客地址: 点这里最终的效果：剖析代码（本菜鸡第一次看有点绕）marquee.vue的源代码<template> <div class="marquee-wrap"> <div class="scroll"> <p class="marquee">{{ text }}</p> <p class="copy">
2021-04-15 17:22:10
2216
5
原创 修改elementui的el-popover的样式不成功的原因！！！
项目中使用了el-popover，但是想修改一下样式，一直不成功，先来看一下官方文档怎么说的添加一个类名，string类型，ok，添加一个<el-popover placement="right" width="400" trigger="hover" popper-class="my-popover" >去设置样式<style lang="scss" scoped> .my-popover{ padding:20px; }
2021-04-02 15:01:59
4003
9
原创 elementui el-menu router跳转方式传递参数
最近再做一个后台管理项目，权限控制到用户可以操作的页面按钮，获取用户按钮需要菜单的moduleId，那么逻辑就是：在点击菜单的时候加载子页面并且把菜单的moduleId带过来 <el-menu class="el-menu-vertical-demo" background-color="#fff" text-color="#222" unique-opene
2021-02-25 11:06:10
8612
原创 elementui 新增和编辑使用同一个dialog
项目中很多场景都有新增和编辑，使用一个dialog完成两个功能新增和编辑分开写就上下面这样，写两个dialog <!--添加角色对话框--> <el-dialog title="添加角色" :visible.sync="addRoleDialogVisible" width="30%"> <el-form ref="form"
2021-02-03 16:31:24
3315
原创 el-radio的坑
vue项目中：1.如果不需要显示文字，只需要显示单选框，那就将label隐藏scss写法::v-deep .el-radio__label{ display: none;}less写法/deep/ .el-radio__label{ display: none;}2.el-table中有一列 是默认选中，用到了el-radio单选框，只能有一个选中获取到的数据格式， isDefault控制是哪一行的radio选中，取值为1表示选中，取值为0不选中[ {
2021-02-03 16:02:20
1610
原创 elementui每次显示el-dialog都进行初始化
先说解决方案：加上v-if每次都会销毁和重新创建<el-dialog title="提示" :visible.sync="dialogVisible" v-if="dialogVisible" width="30%" :before-close="handleClose"></el-dialog>在项目中遇到一个场景，点击table中的授权按钮，去给这一行对应的用户授权角色逻辑：点击授权按钮，显示授权dialog，在子组件的created生命周期中去获取
2021-02-03 15:33:46
3937
原创 el-table使用相关问题
1.表头的表格内容居中显示给el-table标签加上这两句代码:header-cell-style="{'text-align':'center'}":cell-style="{'text-align':'center'}"2.表格数据是true/false，但是需要显示其他信息，怎么办？valid是布尔值<el-table-column prop="valid" label="是否有效"> <template slot-scope="scope"&g
2021-01-28 10:30:16
391
原创 el-input输入框的空格问题
技术栈：vue + elementui需求：在表单中，输入的内容要去除两端空格1.允许输入空格2.输入空格后表单非空验证不通过解决方式1：使用v-model的指令修饰符.trim(缺点：不能输入空格，不满足需求)解决方法2：使用blur方法在失去焦点时进行trim（）<el-form ref="form" :model="formData" :rules="formRules" style="width:80%;margin-top:20px;"
2021-01-28 10:13:54
3505
原创 echarts学习笔记
文章目录1.什么是ECharts2.ECharts基本使用3.标题组件4.工具箱组件5.弹窗组件6.饼状图7.航线图1.什么是ECharts什么是ECharts?ECharts是一个使用 JavaScript 实现的"数据可视化"库, 它可以流畅的运行在 PC 和移动设备上什么是数据可视化?也就是可以将数据通过图表的形式展示出来，ECharts提供的图表类型ECharts 提供了常见的折线图、柱状图、散点图、饼图、K线图，用于统计的盒形图，用于地理数据可视化的地图、热力图、线图，用于关系
2021-01-21 11:35:25
449
2
原创 隐藏当表单验证不通过时的输出async-validator警告
隐藏前：点右边找到代码的位置，注释掉代码文件路径：node_modules\async-validator\es\util.js将console.warn(type, errors);注释掉重新查看没有输出了！！！
2021-01-08 15:04:00
1780
原创 js 找出两个数组中不同和相同的元素
找出两个数组中不同的元素思路:将两个数组连接起来，不同的元素在连接后的数组中只有一份，同时从前面找和从后面找，若索引一致则选出来let arr1 = [1,2,3,4];let arr2 = [2,4,5,6];let getDiffElement = (arr1,arr2)=>{ console.log(arr1.concat(arr2));//连接后的数组 return arr1.concat(arr2).filter((value,index,arr)=>{
2021-01-07 10:44:08
1407
转载 vue项目中美化滚动条
可以在App.vue中全局写::-webkit-scrollbar-track{background: rgba(0,0,0,.1);border-radius: 0;}::-webkit-scrollbar{-webkit-appearance: none;width: 10px;height: 10px;}::-webkit-scrollbar-thumb{cursor: pointer;border-radius: 5px;background: rgba(0,0,
2021-01-05 18:45:44
1846
原创 element-ui的form居中， label自适应宽度，el-select和el-input一样宽，整体在dialog居中,el-select默认选中第一项
效果图代码部分：1.整体form在dialog中居中::v-deep .el-dialog .el-dialog__body{ display: flex; justify-content: center; align-items: center;}为什么要使用 ::v-deep来穿透样式？因为是scoped样式lang=“scss” 写了 /deep/不生效**（以后就写::v-deep）**2.label宽度自适应设置label-width=“a
2020-12-31 11:35:11
11655
1
原创 课程简介
H5+C3基础零基础掌握网页制作的能力并扎实应用做出精美的页面，核心知识点：C3选择器、C3动画H5 + C3项目实战项目：去哪网（伸缩布局）、风暴英雄官网、VIVO官网（响应式）、苏宁电商官网从零玩转JavaScript核心+新特性javaScript从入门到精通，掌握js精髓，玩转网页特效，核心知识点：DOM、BOM从零玩转CSS预处理器+项目实战从零掌握企业真实使用的css书写方法，玩转Less、Sass项目：绝地求生官网、蘑菇街、驴妈妈从零玩转Ajax+jQuery原理从零开始玩
2020-11-23 23:10:08
136
原创 vue项目配置devServer：chrome无效，打开还是在ie浏览器，已解决
vue项目里面的配置devServer:{ open: 'Google Chrome',}vscode里面的default browser也是chrome问题：每次运行vue项目还是在ie浏览器打开无语。。。。解决方法：修改电脑的默认应用将默认的Web浏览器设置为chrome再去运行项目，默认在chrome打开了，问题解决。...
2020-10-26 11:39:46
759
4
原创 package.json中^和~的含义
"dependencies": { "axios": "^0.20.0", "core-js": "^3.6.5", "element-ui": "^2.13.2", "http-proxy-middleware": "^1.0.5", "normalize.css": "^8.0.1", "vue": "^2.6.11", "vue-router": "^3.2.0", "vuex": "^3.4.0" },指定版本号（1）指定..
2020-10-12 10:17:37
958
原创 通过简单的小例子来看函数防抖和函数节流
什么是函数防抖？函数防抖是优化高频率执行js的一种手段可以让被调用的函数在一次高频操作的过程中只被调用一次函数防抖的作用减少代码的执行频率，提升网页性能应用场景oninput、onmousemove、onscroll、onresize等一个小例子（防抖前）：当输入框的内容改变就会打印输出内容<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <met
2020-09-28 14:54:23
212
原创 本菜鸡第一次使用 DocumentFragment来优化重排重绘
起因：本菜鸡写的一段代码性能不好，重排重绘开销大，导师让我去改！菜鸡代码附上 let str = ''; for(let i = 0; i < arr.length; i++){ str = ` <div class="box"> ${arr[i].name}**${arr[i].age} </div> `; container.inner
2020-09-04 11:47:05
259
原创 flex伸缩布局知识点
知识清单伸缩布局基本概念设置给容器的属性：flex-direction属性justify-content属性（主轴上的对齐方式）align-items(侧轴上的对齐方式)flex-wrap（如何换行）align-content（控制换行后的对齐方式）flex-flow设置给伸缩项的属性align-self(单独控制伸缩项在侧轴上的对齐方式)order（伸缩项的排序属性）flex-grow（伸缩项的扩充）flex-shrinkflex-basisflex伸缩布局基本概念Flex 是 Flexible Bo
2020-08-20 14:03:41
679
原创 vue基础知识大全
知识清单初识vue初识vue1.什么是Vue?Vue.js 是一套构建用户界面的框架，它不仅易于上手，还可以与其它第三方库整合(Swiper、IScroll、…)。2.框架和库的区别?框架：是一套完整的解决方案；对项目的侵入性较大，项目如果需要更换框架，则需要重构整个项目。库（插件）：提供某一个小功能，对项目的侵入性较小，如果某个库无法完成某些需求，可以很容易切换到其它库实现需求。例如: 从jQuery 切换到 Zepto, 无缝切换从IScroll切换到ScrollMagic, 只需要将用
2020-08-16 14:44:31
805
1
原创 NodeJS核心 + 原理
知识清单NodeJS简介1.什么是Node.js?2.什么是V8引擎?3.什么是运行环境?4.总结NodeJS运行环境搭建NodeJS执行代码NodeJS环境和浏览器环境执行JS代码区别NodeJS全局属性和方法（部分）node模块化（CommonJS规范）1.nodeJS开发中的模块2.什么是CommonJS规范？3.node模块化中暴露数据的几种方式4.require注意点包和包管理简介NPMNRM和CNPM的使用NodeJS简介1.什么是Node.js?Node.js 是一个基于"Chrome
2020-06-20 21:19:25
746
原创 MySQL5.7 修改默认编码为utf-8
1.关闭电脑的mysql服务搜索 —》 服务 —》 找到mysql —》停止此服务2.修改my.ini文件在mysql安装目录下找到my.ini文件(有可能安装目录下没有)那么有可能在另外一个目录下打开my.ini文件，找到[client]添加default-character-set=utf8找到[mysqld]，添加character-set-server=utf83.重启mysql服务搜索 —》 服务 —》 找到mysql —》启动此服务4.查看编码大功告成
2020-06-06 00:21:39
868
原创 港股打新
1.什么是打新？新股，就是新上市公司发行的股票。打新就是申请购买新上市公司发行的股票。申购成功，买到股票，即成为公司股东，俗称“中签”。1.1打新的优势收益高、盈利周期短、本金少、风险低2.为什么打新能赚钱？2.1为什么公司要上市发行股票？可以募集到大量资金，用于公司扩大经营和快速发展可以提高公司的知名度可以吸引更多的消费者上市，意味着公司得把一部分股份拿出来出售给投资者，让更多人成为公司股东。IPO，公司第一次将它的股份向公众出售的这种行为，叫作首次公开募股（Initial Publi
2020-06-01 01:18:45
350
原创 Redis核心 + 高可用
知识目录1.Redis开篇1.Redis开篇1.什么是Redis?Remote Dictionary Server(远程字典服务器)Redis是一个’开源的’使用’C语言’编写的数据库Redis和MongoDB一样是NoSQL类型的数据库不同的是MongoDB存储的是文档, 而Redis存储的是键值对(Key-Value)2.Redis特点速度快Redis默认情况下将数据存储在内存中读取速度能达到10万次/s左右, 写入能到到8万次/秒左右支持数据的持久化Redis默认
2020-05-31 17:22:52
275
原创 MySQL数据库知识大全
快速导航1.数据库简介2.MySQL数据库安装3.数据库链接和断开4.数据库SQL简介5.数据库增删改查6.表的增删改查7.数据增删改查8.数据类型9.数据库完整性1.数据库简介1.什么是数据库?数据库就是存储数据的仓库数据库和Excel很像, Excel本质是一个文件， 数据库本质上也是一个文件，数据库和Excel很像, Excel文件中可以有很多的表, 一个数据库中也有很多的表数据库和Excel很像, Excel文件的每张表就是用来存储数据的, 数据库文件的每张表也是用来存储数据的所以学
2020-05-31 15:17:30
1270
原创 各种技巧和骚操作
按下shift+win+s弹出windows自己的截图工具，支持多种截图方式在pc端登录QQ的情况下，按下ctrl+alt+o弹出文字识别页面，方便提取图片中的文字To be continued…
2020-05-31 00:14:36
216
原创 安装配置image-webpack-loader疯狂报错！！！！
从npm官网安装并且配置在打包的时候疯狂报错，看不懂的那种。。。。解决方法：cnpm install image-webpack-loader --save-dev好了。。。
2020-05-30 16:41:25
1649
原创 webpack-babel配置-兼容低版本浏览器
1.webpack-ES6语法处理在企业开发中为了兼容一些低级版本的浏览器, 我们需要将ES678高级语法转换为ES5低级语法否则在低级版本浏览器中我们的程序无法正确执行，默认情况下webpack是不会将我们的代码转换成ES5低级语法的, 如果需要转换我们需要使用babel来转换2.如何使用babel?https://babeljs.io/2.1安装转换到ES5的相关包npm install --save-dev babel-loader @babel/core @babel/preset-e
2020-05-30 13:43:42
3275
2
原创 webpack-热更新插件
Q:为什么要使用热更新插件？A:为了不刷新网页还能监听文件变化1.什么是HMR?1.1通过webpack-dev-server自动打包并没有真正的放到指定的目录中因为读写磁盘是非常耗时和消耗性能的,所以为了提升性能webpack-dev-server将转换好的内容直接放到了内存中1.2通过webpack-dev-server可以实现实时监听打包内容的变化,每次打包之后都会自动刷新网页, 但是正是因为每当内容被修改时都会自动刷新网页所以给我们带来了很多不便, 这时就需要通过HMR插件来优化调试
2020-05-30 11:53:57
477
原创 webpack-watch与devSever-CORS
1.什么是watch?webpack 可以监听打包文件变化，当它们修改后会重新编译打包那么如何监听打包文件变化呢? 使用 watch2.watch相关配置watchOptionspoll: 1000 // 每隔多少时间检查一次变动aggregateTimeout: // 防抖, 和函数防抖一样, 改变过程中不重新打包, 只有改变完成指定时间后才打包ignored: 排除一些巨大的文件夹, 不需要监控的文件夹, 例如 node_modules//webpack.config.jsmodu
2020-05-23 16:47:02
551
可以直接用的vue-devTools
2020-12-03
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人