- 博客(46)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 批量注册组件
大致步骤：1 使用 require 提供的函数 context 加载某一个目录下的所有 .vue 后缀的文件。2 然后 context 函数会返回一个导入函数 importFn3 它又一个属性 keys() 获取所有的文件路径4 通过文件路径数组，通过遍历数组，再使用 importFn 根据路径导入组件对象5 遍历的同时进行全局注册即可...
2022-06-20 10:12:55
315
原创 vue中样式表公用变量和混入使用
安装less，这里需要安装两个文件，一个是less，另一个是less-loader，yarn安装指令是yarn add less --dev和yarn add less-loader@5.0.0 --dev作者：我喂自己带盐链接：https://www.jianshu.com/p/c7d260eb02a9来源：简书著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。...
2022-05-16 11:39:21
459
原创 ElementUI多语言实现
1 . 安装包$ npm i vue-i18n项目工程下新建js文件import Vue from 'vue' // 引入Vueimport VueI18n from 'vue-i18n' // 引入国际化的包import Cookie from 'js-cookie' // 引入cookie包import elementEN from 'element-ui/lib/locale/lang/en' // 引入饿了么的英文包import elementZH from 'element-u
2022-03-20 17:39:05
834
原创 JS进入和退出全屏方法
1 原生方法// 进入全屏document.documentElement.requestFullscreen()// 推出全屏发方法document.exiFullscreen()2 screenfull 插件if(!Screenfull.isEnable) { this.$message.warning('当前全屏功能不可用') return } Screenfull.toggle() // 既可以全屏也可以退出全屏...
2022-03-19 20:01:28
957
1
原创 vue2中批量全局注册过滤器方法
HTML <el-table-column label="入职时间" sortable prop="timeOfEntry"> <template slot-scope="obj"> {{ obj.row.timeOfEntry | 过滤器 }} </template> </el-table-column>过滤器函数
2022-03-09 14:06:07
814
原创 vue全局注册公共组件方法
1.引入注册组件，在install方法中，调用Vue.componemt(‘组件自定义名’, 组件)// 该文件负责所有的公共的组件的全局注册 Vue.useimport pageTools from './PageTools'export default { install(Vue) { // 注册全局的通用栏组件对象 Vue.component('pageTools', pageTools) }}2.在main.js中注册使用import Component
2022-03-07 16:51:06
1810
原创 web项目上线
文章目录前言一 项目上线相关配置1. 通过 node 创建 web 服务器2. 开启 gzip 配置3. 配置 HTTPS 服务4. 使用 pm2 管理应用前言一 项目上线相关配置1. 通过 node 创建 web 服务器创建 node 项目，并安装 express，通过 express 快速创建 web 服务器，将 vue 打包生成的 dist 文件夹，托管为静态资源。const express = require('express')// 创建 web 服务器const app = e
2021-12-31 11:33:21
149
原创 判定字符是否为某个回文串的排列
var canPermutePalindrome = function(s) {/* let arr=s.split('') // 转换为数组 for(let i = 0; i<arr.length; i++) { for(let j= 1+i; j<arr.length; j++){ if(arr[i] ===arr[j]){ delete arr[i] delete a
2021-12-28 15:11:54
198
原创 项目上线前优化
文章目录一 项目优化策略1. 生成打包报告1 打包报告命令2 通过 vue.config.js 修改 webpack 的默认配置3.为开发模式与发布模式指定不同的打包入口4. configureWebpack 和 chainWebpack4.1 通过 chainWebpack 自定义打包入口2. 第三方库启用 CDN2.1 通过 externals 加载外部 CDN 资源3. Element-UI 组件按需加载4. 路由懒加载5. 首页内容定制一 项目优化策略1. 生成打包报告1 打包报告命令//
2021-12-23 17:33:28
165
原创 判断vue是开发环境还是正式运行环境
文章目录1 判断 process.env.NODE_ENV 的值1 正式环境production2 开发环境 developmentbabelrc 只会影响本项目中的代码，babel.config.js会影响整个项目中的代码，包含node_modules中的代码1 判断 process.env.NODE_ENV 的值1 正式环境production// 生产环境process.env.NODE_ENV ==='production'2 开发环境 development// 开发环境
2021-12-23 17:08:27
617
原创 vue-quill-editor 富文本使用
文章目录一，安装配置文件二 使用.vue组件中使用一，安装配置文件1 安装npm install vue-quill-editor –save2 导入富文本编辑器对应的样式import 'quill/dist/quill.core.css'import 'quill/dist/quill.snow.css'import 'quill/dist/quill.bubble.css'3， vue中注册Vue.use(VueQuillEditor)二 使用.vue组件中使用<qu
2021-12-13 11:00:27
1335
原创 代码格式化.prettierrc 配置
文章目录1 在文件的根目录建一个.prettierrc文件,在文件里写上如下代码:1 在文件的根目录建一个.prettierrc文件,在文件里写上如下代码:{ "semi": false, // 使用分号, 默认true "singleQuote": true, // 使用单引号, 默认false(在jsx中配置无效, 默认都是双引号) "bracketSpacing": true // 对象中的空格 默认true}代码的规范规则很多很繁琐，不可能每个都去手
2021-10-14 10:35:39
845
原创 router导航守卫
import router from '@/router' //import nprogress from 'nprogress'import 'nprogress/nprogress.css'import { getToken } from '@/utils/auth.js'// const whileList = ['/login'] // 定义白名单router.beforeEach(function (to, from, next) { nprogress.start() // 开启
2021-10-12 11:05:46
367
原创 Vue-Cli配置跨域代理
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录1 .解决开发环境的跨域问题1.1 vue-cli的配置文件即**`vue.config.js`**,这里有我们需要的 [代理选项](https://cli.vuejs.org/zh/config/#devserver-proxy)2 生产环境的跨域1 .解决开发环境的跨域问题开发环境的跨域，也就是在**vue-cli脚手架环境下开发启动服务时，我们访问接口所遇到的跨域问题，vue-cli为我们在本地开启了一个服务,可以通过这
2021-09-01 10:11:55
228
原创 vuex基础
文章目录前言一 初始化功能1-state组件中获取 state值1 this.$store.xxx2 辅助函数 - mapState2 -mutations组件中调用mutations1 this.$store.commit(方法名, 载荷参数)2 辅助函数 - mapMutations3 -actions组件调用actions1 原始调用 - this.$store.dispatch('方法名')2 辅助函数 -mapActions4 -getters组件获得getters方式1 this.$store
2021-08-20 15:34:24
369
原创 替换字符串 实现包含的字符串高亮
1 使用正则表达式和replace() const highlightStr = `<span class="active">${this.searchText}</span>` // 正则表达式 // 中间的内容都会当作匹配字符来使用，而不是数据变量 // 如果需要根据数据变量动态的创建正则表达式，则手动 new RegExp // RegExp 正则表达式构造函数 // 参数1：匹配模式字符串，它会根据这个字符串创建正则对
2021-08-16 23:07:51
526
原创 vue中上传文件获得blob 数据
Html <input type="file" hidden ref= "file" @change="onFileChange" /><van-cell-group> <van-cell title="头像" is-link center @click="$refs.file.click()" >Js onFileChange () { // 获取文件对象 const
2021-08-13 15:35:04
876
原创 数字超出Js精度的处理
文章目录前言1 json-bigint 第三方包2 后端数据超出处理前言JavaScript 能够准确表示的整数范围在-2^53到2^53之间（不含两个端点），超过这个范围，无法精确表示这个值，这使得 JavaScript 不适合进行科学和金融方面的精确计算。提示：以下是本篇文章正文内容，下面案例可供参考1 json-bigint 第三方包json-bigint](https://github.com/sidorares/json-bigint) 是一个第三方包，它可以帮我们很好的处理这个
2021-08-10 00:15:39
501
原创 浏览器本地储存数据处理
/* 1. 存储数据 */export const setItem = (key, value) => { if (typeof value === 'object') { value = JSON.stringify(value) } window.localStorage.setItem(key, value)}/* 2，取数据 */export const getItem = (key) => { const data = window.localSto
2021-08-07 22:09:48
118
原创 vue中axios封装及携带参数
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录1 src/utils文件夹下新建requery.js 设置基础地址2 src/api文件夹下新建各个页面请求的js文件需要导入requery.js文件3 src/api/index.js - 统一导出接口供外部使用4 具体逻辑页面按需引入api/index.js 请求使用asyn+await 等待axios返回结果1 src/utils文件夹下新建requery.js 设置基础地址// 网络请求 - 二次封装impo
2021-07-28 23:46:09
3590
1
原创 Vue知识点概况
文章目录前言一、 @vue/cli脚手架 搭建项目1 全局安装@vue/cli 模块包 yarn global add @vue/cli2 创建项目 vue create 项目名yarn serve 启动项目3 @vue/cli 目录和代码分析4 _项目架构了解5_@vue/cli 自定义配置 vue.config.js6_eslint检查代码7_单vue文件讲解二 Vue指令1 插值表达式 {{ 表达式 }}MVVM设计模式 （减少DOM操作, 提高开发效率）2 v-bind （操作属性 简写 ：
2021-07-27 23:44:23
202
原创 webpack 工具使用
文章目录1 webpack基本概念2 webpack使用步骤1 初始化环境 yarn init2 安装依赖包 yarn add webpack webpack-cil -D3 配置scripts定义命令4 webpack使用5 yarn build执行流程图3 webpack的配置1 webpack-入口和出口配置2 html-webpack-plugin插件(生成html文件)1 下载插件 yarn add html-webpack-plugin -D2. webpack.config.js添加配置3
2021-07-19 16:47:40
246
原创 vue前置知识
文章目录1 ES6 模块化1 在 node.js 中体验 ES6 模块化 "type":"module"2 ES6 模块化的基本语法1 默认导出： export default 导入： import 接收名称 from '模块标识符'1.默认导出的注意事项：只允许使用唯一的一次 export default2 按需导出： export 导入： import { s1 } from '模块标识符'1 按需导出与按需导入的注意事项2 Promise1 解决回调地狱的问题2 Promise 概念3 基于回调
2021-07-18 17:52:46
1509
原创 前后端的身份认证
文章目录1 Web 开发模式1. 服务端渲染的 Web 开发模式2. 服务端渲染的优缺点3 前后端分离的 Web 开发模式4. 前后端分离的优缺点5 如何选择 Web 开发模式2 身份认证1 不同开发模式下的身份认证2 Session 认证机制1. HTTP 协议的无状态性2 什么是 Cookie3 Cookie 在身份认证中的作用4 Cookie 不具有安全性5 提高身份认证的安全性6 Session 的工作原理3 在 Express 中使用 Session 认证1. 安装 express-ses
2021-07-14 17:08:34
139
原创 数据库Mysq基础
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录前言一、 数据库的基本概念1 常见的数据库及分类2 传统型数据库的数据组织结构3 安装并配置 MySQL1 MySQL 在 Windows 环境下的安装4 MySQL的基本使用1 连接数据库2. 了解主界面的组成部分3. 创建数据库4. 创建数据表5. 向表中写入数据5 SQL(语法) 实现增，删，改，查1 主要了解内容2 SQL 的 SELECT 语句 select*from 表名1 语法2 示例3 SQL 的 INSER
2021-07-14 15:35:32
219
原创 express基础
文章目录一 初识express1 Express 的基本使用1 安装 npm i express @x.x.x2. 创建基本的 Web 服务器3. 监听 GET 请求4. 监听 POST 请求5. 把内容响应给客户端6. 获取 URL 中携带的查询参数 req.query7. 获取 URL 中的动态参数 req.params2 托管静态资源1 express.static()2.
2021-07-14 11:23:11
234
原创 npm与包
文章目录一、npm与包1 包的下载2 在项目中安装包的命令 npm i3 包中的文件3.1 包管理配置文件3.2 快速创建 package.json （npm i y & npm i）3.3 dependencies 节点 (package.json中记录安装的包)3.4 devDependencies 节点（在项目开发阶段会用到的包）npm i 包名 -D5 安装指定版本的包 npm i xxx@xxxx6 包的语义化版本规范 xx.xx.xx7 卸载包 npm uninstall8
2021-07-14 09:57:20
181
原创 Node.js基础
文章目录一 Node.js与内置模块（fs, path,http）1 Node介绍2 fs 文件系统模块 fs.readfile() && fs.writeFile()2.1 fs.readFile() 的语法格式2.2 fs.writeFile() 的语法格式2.3 案例：考试成绩整理2.4 fs 模块 - 路径动态拼接的问题（__dirname）3 path 路径模块3.1 路径拼接 path.join() 的语法格式3.2 获取路径中的文件名 path.basename()
2021-07-13 16:05:07
299
原创 AJAX+http入门
文章目录一 Ajax1 jQuery中的Ajax1.1 get发起请求 $.get ('url',{携带参数}，fn())1.2 post发起请求 $.post(url, [data], [callback])1.3 $.ajax()函数的语法（综合）1.4 接口测试工具 PostMan2 form表单（3部分组成）1. 标签的属性2. 表单提交数据存在问题3 通过Ajax提交表单数据3.1 监听表单提交事件3.2 阻止表单默认提交行为 e.preventDefault()3.3 快速获取..
2021-06-28 17:30:05
257
原创 git工具使用
文章目录前言一、Git 基础git 基础使用1.Git 中的三种状态 （已修改，以暂存，已提交）2. 配置用户信息2.1 获取帮助信息 git help 3. 获取 Git 仓库的两种方式3.1 在现有目录中初始化仓库 git init4. 检查文件的状态 git status (-s)5. 跟踪新文件 git add.6. 提交更新 git commit -m " 说明"8 对已提交的文件进行修改 git commit -m "提交消息"9 撤销对文件的修改（不可逆） git checkout --"
2021-06-27 22:54:34
380
原创 ES6 的新增语法
文章目录前言一 ES6 的新增语法1.1 let1.1.1 经典面试题1.2 const（定义常量）1.3 let、const、var 的区别2 解构赋值2.1 数组解构2.2 对象解构3 箭头函数3.1 箭头函数不绑定this关键字4 剩余参数4 .1 剩余参数和解构配合使用5 ES6 的内置对象扩展5.1 Array 的扩展方法5.1.1 扩展运算符可以应用于合并数组。5.1.2 将类数组或可遍历对象转换为真正的数组5.1.3 构造函数方法：Array.from() 对每个元素进行
2021-06-11 12:17:09
353
1
原创 正则表达式
文章目录二 正则表达式在 JavaScript 中的使用2.1 创建正则表达式2.2 测试正则表达式 test3 正则表达式中的特殊字符3.1 正则表达式的组成3.2 边界符 ^ , $3.3 字符类 [], [-]范围符, [^] 取反3.4 量词符 （设定出现次数）3.4 案例：用户名验证分析3.5 括号总结3.6 预定义类 常见模式的简写方式。4 正则表达式中的替换4.1 replace 替换4.2 正则表达式参数一 ，概述正则表达式（ Regular Expression
2021-06-10 23:59:36
602
原创 JavaScript高级（面向对象）
文章目录1 面向对象编程介绍1.2 面向过程编程 POP(Process-oriented programming)1.3 面向对象编程 OOP (Object Oriented Programming)1.4 面向过程和面向对象的对比2 Es6 中的类和对象2.1 对象2.2 类 class2.3 创建类&创建实例：2.4 类 constructor 构造函数2.5 类添加方法3 类的继承3.1 super 关键字-可以调用父类的构造函数3.2 super关键字 也可以调用父类的普通函
2021-06-07 12:17:18
295
1
原创 数据可视化ECharts入门
数据可视化ECharts使用文章目录一、常见的数据可视化库2 数据可视化项目概述二 ECharts简介2 ECharts的基本使用2.1 ECharts 使用五步曲2.2 相关配置讲解2.2.1 series: 系列列表2.2.2 小结一、常见的数据可视化库2 数据可视化项目概述二 ECharts简介官网地址：https://www.echartsjs.com/zh/index.htmlECharts是一个使用 JavaScript 实现的开源可视化库，可以流畅的运行在 PC 和移动设
2021-06-04 14:04:34
622
1
原创 原生Js 功能案例
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录一、tab栏切换一、tab栏切换点击不同标题显示不同内容// 开始给5个小li 设置索引号 lis[i].setAttribute('index', i)// 让lis[i]对应item items[index]代码部分： <script> // 获取元素 var tab_list = document.querySelector('
2021-05-21 11:50:25
162
原创 javaScript 语法基础
ECMAScript 基础文章目录ECMAScript 基础前言一、变量1 变量的使用（声明变量 -赋值）2 变量语法扩展2.1 同时声明多个变量2.2 声明变量特殊情况3 变量命名规范4 变量小结二、数据类型1 为什么需要数据类型2 变量的数据类型(JS拥有动态类型-根据右边变量值的数据类型来判断）3 数据类型的分类(简单& 复杂)简单数据类型（Number & Boolean & String & Undefined & Null）1 Number1.1 数
2021-05-17 18:06:49
228
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人