- 博客(59)
- 收藏
- 关注
RSS订阅原创 打开新文件会覆盖旧文件的解决办法，避免覆盖
vscode使用中会出现打开一个文件，本意是想新开一个窗口编辑器，但实际情况是原来的窗口被覆盖掉了。
2023-09-18 14:18:53
2933
原创 uniapp 项目中uni-drawer 组件中内容超出样式设置溢出滚动只能滚动但是无法滑动问题
在需要滚动的外层换成scroll-view 即可。
2023-07-20 09:47:23
1260
原创 如何恢复被误删的git stash
这里就是之前删除的git stash暂存的信息，包含暂存的日期、别名（我的是地图对比）和暂存的文件列表信息，如果不是我们想要的，就只能挨个看看所有的dangling commit记录了，这里我还没找到捷径。恢复之后效果是相当于已经commit了，但是还没push到远程仓库，但是有些本地的修改是我改着玩的，不能推送，所以还得把这个commit恢复回来。2.然后根据上述命令看到的记录：dangling commit xxxidxxx，输入以下命令，查看该id的具体内容。执行完后，之前的代码就恢复了。
2023-05-09 11:07:37
1381
1
原创 对象扩展方法Object.fromEntries()和Object.entries()的使用
Object.entries()Object.entries(）为ES8中新特性Object.entries(）获取对象的键名和键值，每一对键名和键值组成新的数组let obj = { name:'深圳', scene:['南山','宝安','后海','龙岗']}console.log(Object.entries(obj)) Object.fromEntries()使用二维数组形式创建对象let arr = [ ["name","city"], ["cities","广东,深圳,
2021-11-12 16:52:46
503
原创 javascript Optional chaining：可选链操作符（?.）的介绍与使用
javascript Optional chaining：可选链操作符（?.）的介绍与使用例：有如下对象let person = { name: 'pyq', age: 18, address: { // country: 'CHINA', // city: { // city: 'shengzhen', // area: 'nanshan' }, }, getInfo: function() { return `${this.name}今年${this.age}岁
2021-11-12 15:19:41
473
原创 根据数组属性，拿到元素下标
使用findIndex(）方法//tableData为原数组，row.id为对象的id属性let arr = this.tableData;let id1 = arr.findIndex((arr) => arr.id == row.id);//id1为对象的数组下标this.tableData.splice(id1, 1);//删除该对象，实现局部刷新的功能...
2021-11-02 09:50:56
481
原创 小程序如何动态修改数组中的某一值
微信小程序this.setData()动态修改数组中的某一值我们需要动态修改数组中的某一个值时怎么办，可以拼装变量来进行赋值，请看例子。showAll(e) { let index = e.currentTarget.dataset.index // 获取数据的索引 let temp = 'EmpDailys[' + index + '].isOpen' this.setData({ [temp]: true }) },关键就是拼装temp变量，利用
2021-09-27 14:24:00
990
原创 js只保留数组对象的某个属性
假如我想保留数组中对象的id属性，其他属性统统删除，思路就是使用map循环再结合assign即可： let data = [{ id: 1, name: 'pyq' }, { id: 2, name: 'zs' }] let newData = [] data.map(i => { newData.push(Object.assign({}, { name: i.name, })) }) console.log(newData, 'pyq')原[{ id: 1, nam
2021-09-07 17:53:50
4822
原创 提高代码效率的 20 个JavaScript 技巧和窍门
目录1. 声明和初始化数组2. 找出总和、最小值和最大值3. 对字符串、数字或对象数组进行排序4. 从数组中过滤出虚假值5. 对各种条件使用逻辑运算符6. 删除重复值7. 创建计数器对象或映射8. 三元运算符很酷9. 与旧版相比，for 循环更快10.合并2个对象11. 箭头函数12. 可选链13. 打乱数组14. 空合并算子15. Rest & Spread 运算符16. 默认参数17. 将十进制转换为二进制或十六进制18. 使用解构简单交换两值19. 单行回文检查20.将Object属性转成属性
2021-06-21 11:35:54
352
3
原创 极简数组去重
数组去重：set有去重功能，返回类数组，通过 延展符/Array.from 转成数组let arr = [1,1,1,1,2,2,2,3,3,3,5,6,7];[…new Set(arr)]; // [1, 2, 3, 5, 6, 7]Array.from(new Set(arr)); // [1, 2, 3, 5, 6, 7]
2021-06-03 18:34:54
73
原创 vscode配置 easy sass
vscode配置 easy sass第一步:首先在vscode插件库中下载easy sass插件第二步:第三步：这个是默认配置“easysass.compileAfterSave”: true, `为false避免这类文件编辑保存后被编译为无效，css 需要手动删除的尴尬。“easysass.targetDir”: “”"easysass.excludeRegex": "","easysass.formats": [ { "format": "expanded
2021-04-29 10:06:48
1357
原创 文字超出省略
单行max-width: 16em; //最多15个字overflow: hidden;white-space: nowrap;text-overflow: ellipsis;多行overflow : hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2; //最多行数-webkit-box-orient: vertical;
2021-04-27 10:54:59
72
原创 Yarn 与 Npm 命令对比
初始化npm inityarn init安装依赖包npm i | installyarn (install)安装生产依赖并保存包名npm i 「依赖名称」 --S | --saveyarn add「依赖名称」安装开发依赖并保存包名npm i 「依赖名称」–D | --save-devyarn add 「依赖名称」-D删除依赖包npm un | uninstall 「依赖名称」yarn remove「依赖名称」全局安装npm i -g | npm -g i「依赖名称」yarn
2021-01-07 18:19:27
805
原创 代码如何简化
前言:做为小菜鸡的我们，写出的代码往往不够简介，在大佬review的时候，往往会把人家几颗大牙笑掉，所以啊，我们得争气，我列举下几个常见几个场景1.设置参数默认值：在这里面，参数里的等号就是给参数默认值，不给实参就会采用默认的形参2.巧妙利用return简化后就是const buyFruit = (amout=1)=>{return amout}3.如果只是单纯判断两个值然后返回布尔值时函数体里完全可以简写成return cur==user就行了...
2020-11-24 17:31:06
1434
原创 摸鱼神器：在命令行中玩斗地主
前言：斗地主我想大家都会玩吧，但是不知道大家有没有在命令行内玩过斗地主。这个项目是基于 Netty 实现的一款命令行斗地主游戏，在下班后或者工作闲暇之余，你都可以肆无忌惮的在命令行中玩斗地主~逛逛常用的摸鱼神器，贼赞！安装\color{red}{安装}安装下载打包(该项目需要一些Java基础，需要确保您的机器拥有JVM环境)git clone https://github.com/ainilili/ratel.gitcd ratelmvn install package接下来，运行 lan
2020-11-24 14:33:49
202
原创 this指向问题（面试必问，不讲武德）
前言：依稀记得，面试时，面试官一来我啪的就站起来了，很快啊！然后上来就是问我关于this指向的问题，我全都写完了啊！1.一来啊，就先要我概述this及其作用\color{red}{概述this及其作用}概述this及其作用概述（1）this是每次调用函数的时候都会向函数内部传递进一个隐含的参数。（2）this指向的是一个对象，函数执行的上下文对象。（3）根据函数的调用方式，this的指向也不同。（4）我们可以把this理解为这个函数执行者。注意：ES6中的箭头函数没有this指向的，它里面
2020-11-24 11:38:44
710
原创 echarts水球图（加基线）
效果：代码：const data = [0.68, 0.36]option = { // x轴 xAxis: { show: false, // 不显示 }, // y轴 yAxis: { show: false, // 不显示 }, grid: { top: '2.5%', right: '40', bottom: '2.5%', left: 0,
2020-11-19 13:48:41
359
原创 输入框输不出0.0
前言：在做功能的时候发现封装的输入框没法输入0.0，输入0.后再输0则会变成0，开始以为是我验证正则出了问题，效验好正则后经过断点试调才发现问题原因：里面的逻辑每次输入值都会对值进行Number强转换，0.0会转成0,chechNum(e) { if (e.target.dataset.key !== this.identifier) { return; } const val = e.target.value; if (val) {
2020-11-13 14:38:37
198
原创 展开运算符用法示例
代码如下：pickerSubmit(val) { const oldData = this.goodList[this.productIndex]; const newData = { ...oldData, productPrice: val.price, retailPrice: `¥${val.price}`, productId: val.id, productName: val.name,
2020-11-09 16:07:39
111
原创 去除一个数组中相同的属性的对象数组（或保留其中属性不同的）
前言：遇到一个问题，一个数组对象中要留下id相同，但数量大的对象，其他值不变初始数据结构[{id: 1, count:1, name: ‘苹果’}，{id: 1, count:2, name: ‘苹果’}，{id: 3, count:3, name: ‘梨’}，]想要的数据结构[{id: 1, count:2, name: ‘苹果’}，{id: 3, count:3, name: ‘梨’}，]代码实现：repetition(arr) { // 去除id相同留下count大的
2020-11-05 17:42:56
760
原创 mint-ui loadmore 上拉显示马上触底（触发上拉触底事件）
问题：这是上拉加载时遇到的坑，进入页面会马上触发上拉事件而不是触底后才触发；<div style="height:100vh;overflow: scroll;"> <mt-loadmore :top-method="loadTop" :bottom-method="loadBottom" :bottom-all-loaded="allLoaded" ref="loadmore" bottomPullText="上拉加载更多"> <ul> &l
2020-10-31 17:53:16
420
原创 Vuex的介绍与使用
vuex是什么？官网Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式，统一管理和维护vue的可变状态。应用场景多组件共享状态 多个组件使用同一个数据任何一个组件发生改变 其他的组件也要跟着发生相应的变化vuex的五个核心属性五个核心概念：State、Getter、Action、Mutation、Module一、Statestate是vuex的全局状态数据由于vuex状态存储是响应式的，所以vue组件从store中获取状态最简单的方法就是写在计算属性中通过在根实例中注册
2020-10-26 12:03:21
136
原创 vue中watch和computer区别
前言：watch和computed都是以函数为基础的，但各自却都不同一、作用机制上watch和computed都是以Vue的依赖追踪机制为基础的，它们都试图处理这样一件事情：当某一个数据（称它为依赖数据）发生变化的时候，所有依赖这个数据的“相关”数据“自动”发生变化，也就是自动调用相关的函数去实现数据的变动。二、从性质上1.computed是计算属性，事实上和和data对象里的数据属性是同一类的（使用上）。2.watch:类似于监听机制+事件机制。例如：watch: { firstNam
2020-10-26 10:36:24
3823
原创 $route 和 $router 的区别
$route 和 $router 的区别$route$route对象表示当前的路由信息，包含了当前 URL 解析得到的信息。包含当前的路径，参数，query对象等。1、$route.path字符串，对应当前路由的路径，总是解析为绝对路径，如 “/foo/bar”。2、$route.params一个 key/value 对象，包含了 动态片段 和 全匹配片段，如果没有路由参数，就是一个空对象。3.$route.query一个 key/value 对象，表示 URL 查询参数。例如
2020-09-24 18:32:54
1388
原创 webpack-横幅plugin的使用（添加版权）
前言：假如你的代码具有很强的影响力，请问你是否需要版权声明？版权声明插件使用具体步骤：1.打开webpack.config.js，需要用到插件BannerPlugin，它是属于webpack自带的插件。所只需添加如下代码：const webpack = require("webpack") plugins: [ new webpack.BannerPlugin('最终版权归<pyq>所有') ]最后执行，检查你的bundle.js，便有如下效果目
2020-08-27 20:35:55
264
原创 vue中key的作用
前言：vue和react都实现了一套虚拟DOM，使我们可以不直接操作DOM元素，只操作数据便可以重新渲染页面。其功劳归功于背后高效的Diff算法。vue和react的虚拟DOM的Diff算法大致相同两个相同的组件产生类似的DOM结构，不同的组件产生不同的DOM结构。同一层级的一组节点，他们可以通过唯一的id进行区分。当页面的教据发生变化时，Diff算法只会比较同一层级的节点1.如果节点类型不同，直接干掉前面的节点，再创建并插入新的节点，不会再比较这个节点以后的子节点了。2.如果
2020-08-21 11:05:28
218
原创 Vue 的生命周期
beforeCreate(){} 创建之前data ----- undefindmethod --- undefind$el ------ undefindcreated(){} 创建完成 (如果需要用请求到的数据渲染页面, 可以在此处发请求)data ----- 数据观测(data observer) // 尽量不要在此处操作datamethod --- 可用$el ------ undefindbeforeMount(){} 挂载之前 .
2020-08-20 10:54:59
121
原创 Vue中slot的使用
前言：当我们想动态替换子组件模板template中的内容时，我们就需要使用slot插槽1.组件中有单个或多个未命名slot标签时<div id='app'> <cpn> <button>按钮</button> </cpn> <cpn> <p>handsomeboy</p> <p&
2020-08-17 12:00:09
225
原创 vue 父子组件通信
图示：1.父组件向子组件传值父组件可以在引用子组件的时候，通过属性绑定的形式，把数据传递给子组件小例子: <div id='app'> <cpn :cmessage="message" :clist="list"></cpn> </div> <template id="cpn"> <div> <h1>{{cmessage}}</h1&
2020-08-14 21:22:33
141
原创 ＜img＞ 的 title 和 alt 属性的区别
1.<img> 的 title 和 alt 属性的区别alt是img的特有属性，除了装饰性的图片外，必须设置有意义的值，搜索引擎会重点分析作用是图片无法加载时用来替代的文字说明title 属性是global attribute之一，作用是提供建议性的信息，通常是鼠标滑动到鼠标元素上显示title属性可以为链接添加描述性文字，用来更清楚的表达链接的目的两者的区别？替换文字（alt text）并不是用来做提示（tool tip），或者更加确切的说，它并不是为图片提供额外说明
2020-08-14 09:13:49
655
原创 typeof null返回Object的原因
前言在 JS 中，存在着 6 种原始值，分别是：stringbooleanundefinednullsymbol我们可以通过typeof 来检测它们的类型，但 typeof null 会输出 object，很多人会认为他是个对象类型，其实这是错误的。typeof null 的历史第一代JavaScript引擎中的JavaScript值表示为32位的字符。最低的3位作为一种标识，表示值是对象、整数、浮点数或者布尔值。对象的标示是000。而为了表现null值，引擎使用了机器语言NULL指
2020-08-13 08:47:27
610
原创 react表单实现数据的双向绑定
步骤：绑定表单的value属性值到state中的变量监听表单控件的onChange事件,当表发生变化的时候触发绑定事件函数利用绑定事件传入的event.target获取变化事件对象，通过event.target.value取相应事件变化的相应值通过将state中的value重新赋值实现数据的绑定显示简单的实现例子：...
2020-08-12 17:36:57
660
原创 react 严格模式（控制台调用两次问题）
前言：由于用脚手架创建项目，默认会自动启用严格模式，所以你会发现双调用现象严格模式(Strict Mode)StrictMode 是一个用以标记出应用中潜在问题的工具。就像 Fragment ，StrictMode不会渲染任何真实的UI。它为其后代元素触发额外的检查和警告。注意:严格模式检查只在开发模式下运行，不会与生产模式冲突。\color{#FF3030}{注意: 严格模式检查只在开发模式下运行，不会与生产 模式冲突。}注意:严格模式检查只在开发模式下运行，不会与生产模式冲突。impo
2020-08-12 15:11:36
2374
原创 react的事件传参的方式
事件的几种传参方式简单案例：效果为点击按钮改变counter的值import React, { Component } from 'react'export default class App extends Component { state = { counter: 1 } handelAddClick = (step) => { this.setState({ counter: this.state.coun
2020-08-11 19:41:07
261
原创 react中属性的验证
前言：为了验证传递进来的数据是否符合我们期望的类型或者要求，React提供了PropTypes这个对象用于校验属性的类型准备工作：首先我们要先安装一个propTypes库，脚手架命令 npm i prop-types --save接着在使用前得先引入prop-type定义好一个对象，添加属性验证简单案列：import React, { Component } from 'react'//1. 引入验证库import PropTypes from 'prop-types'; /*
2020-08-11 16:01:45
585
原创 react设置props的默认值
一般设置props的默认值有两种方式指定 props 的默认值， 这个方法只有浏览器编译以后才会生效class HandsomeBoy extends Component{ // 设置默认值 //defaultProps 可以为 Class 组件添加默认 props,基于 static 的写法 static defaultProps = { name:'pyq' } constructor(props){ super(props) } render(){
2020-08-11 14:50:34
4896
原创 宝塔面板 MySQL 数据库开启错误解决
前言：今天服务器换成了windows 别人说宝塔好用，于是踩了下坑1.连接不到msql你得确保你创建了数据库并且给个权限也放行了3306端口保险起见在看下阿里云或腾讯云服务器上控制台的端口放行没2.能连数据库了，但好像没什么权限，你得给他配置然后应该就欧拉！...
2020-08-05 20:29:50
2196
原创 fatal: refusing to merge unrelated histories 错误解决
前言：本地新建的仓库，与远程github关联后，pull发现报错发现原因原来是两个分支是两个不同的版本，具有不同的提交历史为了允许不相关历史提交，强制合并，就得后面加上一句：–allow-unrelated-historiesgit pull origin master --allow-unrelated-histories...
2020-08-05 11:13:15
250
原创 解决ElementUI导 航栏中的vue- router在3 .0版本以 上重复点菜单报错问题
前言：在使用ElementUI中的导航时，默认情况下如果重复点击某选项，会报错，虽然对项目没啥影响，但红色报错真的很难受。诺！可以在router的配置文件中（router -> index.js）加上下面这句话，const originalPush = VueRouter.prototype.pushVueRouter.prototype.push = function push(location) { return originalPush.call(this, location).c
2020-08-04 14:53:35
281
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人