- 博客(56)
- 收藏
- 关注
RSS订阅转载 Js根据拼音首字母分组
记录一下Js根据拼音首字母分组的方法引自https://segmentfault.com/a/1190000017321316如有侵权请联系。const pySegSort=(arr) =>{ if (!String.prototype.localeCompare) return null // let letters = 'abcdefghjklmnopqrstwxyz'.split('') let letters = 'ABCDEFGHJKLMNOPQRSTWXYZ'
2021-05-08 14:56:53
1464
3
原创 js 获取对象在数组中的index
需求：数组中的元素是对象，需要获取对象在数组中的index方法：使用findIndex方法原数据：const array = [ { id:1, name:'张xx' }， { id:2, name:'王xx' }]方法：const index = array.findIndex(function(val){ return val.id === 1 })// 如果有多个满足，返回第一个的indexconsole.log(index) // 0...
2021-03-20 10:55:52
5514
原创 js过滤筛选树（tree),过滤不满足条件的项
需求：过滤tree型数据中不满足条件的数据，注意点：子级数据被过滤后，会影响父级数据，如下数据：需要把type!==2 的并且没有子级的数据过滤掉，当子级全都不满足条件，全部过滤时，父级也可能要被过滤
2021-03-20 10:44:44
4179
3
原创 element-ui 表格展示html格式内容
<el-table-column prop="content" label="内容" align="center" > <template slot-scope="scope"> <div v-html='scope.row.content'></div> </template> </el-table-column>
2021-03-02 15:56:49
1391
原创 webpack配置报错configuration.devtool should match pattern “^(inline-|hidden-|eval-)?(nosources-)?(cheap-
webpack5 配置报错webpack配置报错configuration.devtool should match pattern "^(inline-|hidden-|eval-)?(nosources-)?(cheap-将devtools配置成：eval-cheap-module-source-map 完美解决，我也不知道什么原因传送门：https://webpack.js.org/configuration/devtool/...
2021-02-27 10:35:34
4315
4
原创 Error: Cannot find module ‘webpack-cli/bin/config-yargs‘ 报错解决
Error: Cannot find module ‘webpack-cli/bin/config-yargs’ 报错解决报错原因：webpack-cli 和 webpack-dev-server 版本不一致导致。解决方法：安装webpack-cli 和 webpack-dev-server 版本一致，都是3版本，完美解决
2021-02-27 09:20:19
403
原创 浏览器400错误
400错误是我们经常遇到的一个错误状态代码，400错去的原因通常是由于提交的数据类型和后台需要数据类型导致的。例如：后台需要的String，而这时就会报400错误
2021-02-24 16:25:03
2000
原创 vue样式透传
vue 通过scoped可以将样式隔离在组件内，从而组件之间的样式互相不影响，但是当我们需要在当前组件改变其他组件样式时，就不适用了。这时我们可以使用**样式透传**，意思就是将该样式透过scoped。scss/sass 的vue样式透传语法：本组件选择器 ::v-deep 其他组件选择器...
2021-02-24 15:29:13
416
原创 js数组字符串项（String）转数值(Number)
想要的效果：[‘123’,‘465’] =》[123,456]const arrString = ['123','465']const arrNumber = arrString.map(number) // [123,456]
2021-02-22 15:28:23
1024
1
原创 element 日期时间组件，限制日期时间选择范围，不能选择早于当前的时间
使用picker-options属性，直接上代码<el-date-picker v-model="form.date" type="datetime" placeholder="选择时间" value-format="yyyy-MM-dd HH:mm:ss" :picker-options="{ disabledDate: (time) => {
2020-12-23 20:34:10
6689
原创 前端技术选型报告
一、 技术栈VueJs+ElementUI+WebSocket/stopmJs+百度地图API+nodeJs/MockJs运行平台：现代浏览器（Chrome、Firefox、Edge以及大部分国产浏览器的极速模式）二、 框架选型Vue全家桶（vue+vue-router+axios）主要特性：1、 渐进式MVVM框架2、 组件化编程，方便复用3、 虚拟DOM技术，页面性能好4、 API简洁明了5、 社区丰富强大Vue vs React1、 都支持平台级的大型复杂应用，生态都很丰富2
2020-12-16 21:11:38
1716
1
转载 Linux(CentOs)安装nginx流程
转发的，如有侵权请联系，转发地址https://blog.csdn.net/t8116189520/article/details/81909574记录在centos安装nginx的流程1.安装依赖包//一键安装上面四个依赖yum -y install gcc zlib zlib-devel pcre-devel openssl openssl-devel2.下载并解压安装包//创建一个文件夹cd /usr/localmkdir nginxcd nginx//下载tar包wget h
2020-12-11 19:10:06
106
原创 vue代理接口配置
vue在开发的时候代理接口配置在vue.config.js中module.exports={··· devServer：{ ··· porxy:{ '/api': { // 调用的接口前缀 target: "http://192.168.x.xxx:6180", // 代理的ip+port changeOrigin: true, // 是否允许跨域 secure: false, // 是否是https请求 path
2020-12-11 13:47:13
413
原创 内网穿透的一种方式——基于ngrok的小米球
记录一种内网穿透的方式——小米球。小米球是国内一位大神搭建的ngrok服务器，免费的是1M带宽，开通vip60块钱，永久使用5M的共享带宽。链接，http://ngrok.ciqiuwl.cn/不是广告，怕以后忘记了，记录一下。...
2020-12-10 09:36:41
528
原创 使用localtunnel做内网穿透
localtunnel时基于nodejs的内网穿透服务1、全局安装localtunnelnpm i -g localtunnel2、内网穿透lt --subdomain <地址前缀> --port 8088(穿透的端口)3、例子lt --subdomain mynet --port 8088your url is: https://mynet.loca.lt访问 https://mynet.loca.lt 相当于访问 localhost:8088 并且外网可以访问...
2020-12-09 20:35:31
712
原创 Nginx部署vue项目（vue+nginx）代理转发
安装nginx下载解压就可以了配置代理nginx/conf/nginx.confserver { listen 8088; #访问的端口 server_name localhost; #ip,服务器名 #charset koi8-r; #access_log logs/host.access.log main; root F:\szpf\coding\shenzhen-oa-website-mas
2020-12-09 20:25:57
3029
原创 vuex 中出现[vuex] module namespace not found in mapActions(): money找不到的报错
使用辅助函数解释小仓库模块的state。vuex 中出现[vuex] module namespace not found in mapActions(): money找不到的报错要在小仓库模块中加入namespaced:true,如下
2020-12-09 09:47:22
2608
原创 vue路由自动注册
记录一下vue路由自动注册的一种方式根据src/views文件夹的路径自动注册路由，文件结构如下：src|--view|----page1 // 页面一|------components // 页面一的组件|------index.vue // 页面一的入口组件|----page2 // 页面2|------components // 页面2的组件|------index.vue // 页面2的入口组件|----index.vue // 公共的布局组件router/index.js
2020-12-08 17:44:59
1115
原创 vue编写全局过滤器
在src目录下创建plugin文件夹，新建一个filters.js专门存放过滤器。filters.js/** * 过滤字符串中html标签 * @param {String} val */export const srciptHtml = (val)=>{ return val.replace(/<\/?.+?>/g,"");}在main.js引入important * as filters from '../plugin/filters'Object
2020-12-08 11:37:13
144
原创 element-ui 表格展示html格式内容
<el-table-column prop="content" label="内容" align="center"> <template slot-scope="scope"> <div v-html='scope.row.content'></div> </template></el-table-column>
2020-12-07 21:38:01
2151
原创 vue组件库开发（npm包发布）
公共组件主要解决了多个应用直接组件的公用问题。这里使用npm构建我们的组件库。最终目录使用vue-cli 搭建一个项目vue create pubilc-compenent 将生成的项目的src文件夹改成examples (组件示例)新建vue配置文件，更改入口地址，确保改名后的examples能运行。新建packages文件夹，存放我们的组件编写第一个组件,参考element-ui结构datePicker.vue<template> <div>这是一
2020-11-07 20:20:20
1373
原创 nodejs使用koa+websocket实现点对点的即时通讯
首先WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。如果还不了解WebSocket的请移步 HTML5 WebSocket在以前，我们处理点对点通信都只能使用轮询，原因是服务器不能主动向客户端发送信息。有了websocket，使得我们的点对点通信变得了更简单和更加高效。废话不多说，这届上代码：服务端app.js// 使用koaconst koa = require('koa')const router = require('koa-router')(
2020-08-13 11:37:08
4375
4
原创 vue如何进行插件的编写
vue的插件，我们通常用来封装一些使用频率很高的全局资源，如：全局属性/方法、全局混入mixins、全局组件等。其实还是解决一个问题，更方便的复用。定义一个插件我们在src/plugin下新建一个index.js，定义的方法和属性一定是在install方法内。index.jsexport default { install(Vue){ // 定义全局属性 Vue.prototype.$myPlugin = '全局属性'; // 定义全局方法
2020-08-06 10:27:06
424
原创 vue如何编写自定义指令directive
vue已经给我们内置了很多很好用的指令了（v-mode 、v-show）等等，但是有时候当这些指令不能满足我们需求的时候，我们还可以使用vue的自定义指令功能编写我们的指令，这是一个很强大的功能。需要说明的是：尽管自定义指令这个功能很强大，但是其是对普通的DOM底层进行了直接的操作，会消耗一定的性能，所以我们在使用的时候一定要权衡利弊。全局定义我们可以使用vue的接口Vue.directive()去定义一个自定义的指令。// 第一个参数为指令的名称，第二参数则是一个对象，包含了指令的钩子函数Vue
2020-08-05 15:44:30
427
原创 vue混入的使用mixins
关于vue的混入，官方给出是说明是这样的，这是一种非常灵活的方式，用来分发vue组件中可复用的功能。混入对象可以包含所有的组件选项。什么意思？使用场景在这里我们可以看到，混入唯一的功能还是解决代码的复用问题，其实很容易理解。就是将我们组件中多次用到的功能（可以包括组件的所有选项）抽离处理，做成公共的功能，然后在需要使用的组件使用mixins进行引用。如果多oop思想有深入理解的同学，可以参照oop思想帮助理解，和oop有一定的相似。其中最典型也是最常用的场景就是：要求界面显示风格不一样，但是里面的
2020-08-05 09:49:19
473
原创 vue动态组件详解
1、 什么是动态组件动态组件是指：在一个挂载点使用多个组件，并进行动态切换。可能对于新手来说，这句话有些难理解，什么是挂载点?可以简单的理解为页面的一个位置。最常见的就是：tab的切换功能。在vue要实现这个功能通常用两种方式。一是使用<component>元素的 is 的特性，二是使用 v-if 。方式一：<template> <div class="hello"> <h3>使用component 的 is特性</h3>
2020-08-03 17:34:19
16436
5
原创 vue插槽的使用-slot
vue的官方文档中介绍插槽是说：slot是一套内容分发的Api。那我们怎么理解solt呢？1、作用插槽可以让用户去扩展组件，增强了组件的扩展性，使得组建的复用更加强大。2、使用场景在组件化开发中，我们说，通常会把一段复用的代码单独写成一个组件，但是有时仅仅是这样不能满足需求，这时候可以用到插槽。通过父组件向子组件分发内容。插槽可以让调用者（父组件）实现结构和样式的自定义。3、插槽的使用3.1、匿名插槽子组件：<!-- --><template> <div
2020-08-03 14:31:52
174
原创 v-clock解决vue初始化闪动问题
使用vue开发的，在初始化的渲染时候，有时会shan出现煽动一下，这是由于刚下载好js文件，还没有完全渲染引起的，通常使用脚手架开发是不会有这个问题的，但是有时我们使用非脚手架开发就会有这个问题。
2020-07-31 15:57:49
1782
原创 nodej使用Express+Ejs+Redis实现留言板功能
使用Express+Ejs+Redis实现留言板功能1、包含功能有：注册用户用户登录用户认证在线留言代码地址：https://github.com/mySoumns/epress-ejsp-redis-message2、效果2.1 留言板列表2.2 注册功能2.3 登录功能2.4 留言功能...
2020-07-30 17:35:06
312
1
原创 nodejs使用Express+sqlite3实现RESTful API http服务器的增删改查
使用Express+sqlite3实现RESTful web服务器。
2020-07-23 17:10:39
2333
原创 使用nodejs的Express框架实现一个简单的HTTP服务器
express在node自带的http模块基础上，致力在http请求和响应上创建一个web程序。下面我们来看一下如何通过express实现一个简单的http服务器。
2020-07-23 08:56:57
779
原创 使用NodeJs实现简单HTTP服务器，并返回简单的html页面
通过nodejs的异步回调实现简单的http服务器，并实现一下功能：异步获取JSON文件（使用fs模块）异步获取HTML模板（fs模块）把JSON文件的内容装置到HTML模板里返回html页面返回给用户效果：
2020-07-22 16:16:34
5067
1
原创 wabpack 配置babel报错问题解决
当我们运行 npn run dev 时babel报错，这是因为babel-loader和babel对应的版本需要一致。ERROR in ./src/js/index.jsModule build failed (from ./node_modules/[email protected]@babel-loader/lib/index.js):Error: Cannot find module '@babel/core'Require stack:- E:\web\webpack\04study\
2020-07-08 16:35:49
381
原创 webpack路径的别名配置
如果还不知道webpack的同学，可以先自行去了一些webpack，传送门webpack详细入门整理我们在使用模块化开发的时候都是使用import或者require去导入我们的模块，但是当我们项目较大，模块较多的时候，我们用相对路径导入是一件麻烦的事情。那有没有一种更简便的方法去匹配路径呢？这时我们可以使用webpack的别名配置功能。1、在我们的webpack.config.js中：配置配置我们resolve.alias// 引入nodejs 的path模块，path.resolve用来处理绝对路
2020-07-08 14:52:44
2432
转载 webpack详细入门整理，webpackp配置（从零开始）
本来想着整理一篇关于webpack的详细笔记和教程，从零开始的，因为网上看到的都是一上来就用webpack构建了项目，而对于很多同学来说这里肯定有很多的疑惑，比如怎么来的配置文件等等，我就想着整理一篇从0开始，从单文件开始打包的详细过程吧。
2020-07-08 09:07:53
628
原创 git基础，常用命令，使用git进行版本控制
使用git进行版本控制，git常用的命令。使用git init初始化，使用git add '地址' 提交到缓存区，使用git commit -m '备注信息' 将缓存区内容提交到仓库，使用git status 命令查看文件状态
2020-07-07 14:27:42
223
原创 vue生命周期详解和使用场景整理
我们从vue的原理上来理解一下vue的生命周期，以及使用场景（使用场景应该试很多新手同学比较懵的地方），建议有条件的同学可以看一下vue源码，更能深入理解。不看源码的同学也没有关系，我们从业务场景切入，尽量讲清楚它的用法。
2020-07-06 11:14:13
3297
2
原创 git使用ssh建立本地仓库和远程仓库的连接
和远程仓库的连接方式通常有两种，一种是https协议，另外一种就是ssh。使用https的时候，每次推送都要输入密码验证，这是比较麻烦的事儿。所有我们使用了ssh进行连接解决这个问题。
2020-07-06 09:08:35
2990
原创 vue监听对象数据的变化 watch
我们使用vue的时候都知道vue有一个很好用watch可以用来监听数据的变化，但是，默认的时候是监听不到对象变化的，这时候就要配置deep=true这个字段。代码：watch: { // 监听对象数据变化 objData: { handler(newVal, oldVal) { console.log(newVal) console,log(oldVal) }, deep: true // 非常非常重要，这个是深度监
2020-07-04 11:55:53
835
原创 使用JavaScript实现一个集合类
集合是一种无序的、唯一的项数据结构，在ES6中提供了原生的set类。现在我们使用ES5实现一个set类。//基于对象实现一个Set类function Set() { //使用对象表示 var items = {}; //判断集合中是否含有某个元素，有返回ture,否则返回false this.has = function(value){ return items.hasOwnProperty(value); }; //添加一个元素 this.add = function(valu
2020-06-09 10:52:24
255
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人