- 博客(105)
- 收藏
- 关注
原创 nuxt 项目部署配合pm2的使用
1.安装cross-env插件npm install -y -D cross-env2.安装pm2npm install -g pm23.配置启动命令3.配置pm2在项目更目录下建 ecosystem.config.js 文件module.exports = { apps: [{ name: 'pc-website', exec_mode: 'cluster', instances: 'max', // Or a number of instanc
2021-04-22 16:31:25
578
2
原创 nuxt 自定义element主题颜色&在nuxt 中按需引入element
按需要引入elment第一步:安装 babel-plugin-component:npm install babel-plugin-component -D第二步:修改plugins/element.js文件(默认nuxt 有个plugins文件夹,在这个文件夹下新建一个element.js文件)import Vue from 'vue'import { Button, Input } from 'element-ui'Vue.use(Button)Vue.use(Input)第三步
2021-04-21 19:21:30
1632
原创 nuxt 切换路由,页面回到顶部
1.全局设置切换路由页面回到顶部在nuxt.config.js:中配置module.exports = { router: { scrollBehavior (to, from, savedPosition) { return { x: 0, y: 0 } } }}2默认情况下,从当前页面切换至目标页面时,Nuxt.js 会让目标页面滚动至顶部。但是在嵌套子路由的场景下,Nuxt.js 会保持当前页面的滚动位置,除非在子路由的页面组件中将 scrollToTo
2021-04-21 15:34:21
3583
原创 vue-cli4安装scss 遇到的问题总结
最近在写新项目,每次引入scss 都会报错,this.getOptions is not a function @ ./node_modules/vue-style-loader??ref--8-oneOf-1-0!./node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/s
2021-04-20 16:57:04
1334
转载 复制对象中的一部分属性给另一个对象
方法一:var obj = { a: 1, b: 2, c: 3, d: 4, e: 5}如果只需要里面的 a b c 属性var {a, b , c} = objvar obj2 = {a, b , c} 方法二:var obj = { a: 1, b: 2, c: 3, d: 4, e: 5}let {d, e,...obj2} = objconsole.log(obj2);方法三:const
2021-04-19 10:35:05
3019
1
转载 关于yarn 和npm 的使用总结
yarn的简介:Yarn是facebook发布的一款取代npm的包管理工具。yarn的特点:1,速度超快。Yarn 缓存了每个下载过的包,所以再次使用时无需重复下载。 同时利用并行下载以最大化资源利用率,因此安装速度更快。2,超级安全。在执行代码之前,Yarn 会通过算法校验每个安装包的完整性。3,超级可靠。使用详细、简洁的锁文件格式和明确的安装算法,Yarn 能够保证在不同系统上无差异的工作。yarn的安装:下载node.js,使用npm安装npm install -g yarn
2021-02-02 18:30:51
811
原创 vue如何设置环境变量
在开发的时候一般会有是三个环境:开发环境 测试环境 线上环境vue 中有个概念就是模式,默认先vue cli 有三个模式development 模式用于 vue-cli-service serveproduction 模式用于 vue-cli-service build 和 vue-cli-service test:e2etest 模式用于 vue-cli-service test:unit但是往往开发的时候可能不止有三种:本地环境(local)开发环境(development)测试环境
2020-05-08 18:28:38
18996
2
原创 搭建本地easy-mock的爬坑之路
看了网上的一些方法,第一种是按照 添加链接描述这个链接里面的方法分别安装node mogonDB Redis s 有一定的版本要求。node 的版本不能超过v9。用这个方法试了一下,没有安装成功,是因为我本地的node过高,,不想降级别,然后试了网上说的另一种方法添加链接描述看了一些介绍说是基于docker-compose安装,简单,不需要额外安装mongodb、Redis 我最后选择了用第...
2020-04-26 23:06:06
780
原创 前端使用Blob实现文件下载
问题来源:在项目中通常会有查询列表的功能,然后把通过筛选条件查出来的数据导入来,通常是导出excel表格这种格式说人话:导出excel你咋实现?人话有时候也不太容易理解?中。可以。没问题!直接上图导出下面红色框中的一坨列表你咋实现/** * 下载blob文件 * @param {*} blob 文件 * @param {*} fileName 文件名 */const downl...
2020-04-09 15:58:53
1101
1
原创 节流throttle与防抖debounce
节流和防抖在开发项目过程中很常见,例如 input 输入实时搜索、scrollview 滚动更新了,等等,大量的场景需要我们对其进行处理。我们由 Lodash 来介绍,直接进入主题吧。**Lodash**API防抖 (debounce) :多次触发,只在最后一次触发时,执行目标函数。lodash.debounce(func, [wait=0], [options={}])节流(th...
2020-04-03 17:31:46
383
原创 根据数组对象key拆分数组
var oldData = [ { name: "aaa", sex:"女", like: 1 }, { name: "aaa", sex:"男", like: 2 }, { name: "bbb", sex:"女", like: 1 }, { ...
2020-03-17 17:33:11
1161
原创 Vue项目页面跳转时候的,浏览器窗口上方的进度条显示
1.安装cnpm install --save nprogress2.在router.js中引入Nprogressimport NProgress from 'nprogress' import 'nprogress/nprogress.css'// nprogress样式文件3.4.绑定路由钩子我们想要的效果是:当路由开始跳转时加载进度条,当路由跳转完毕时进度条加载完毕。幸运的是...
2020-01-19 15:10:38
429
原创 vue全选功能的实现
<template> <div> <div> <input type="checkbox" class="check_box tui-checkbox" @click="checkAll" v-model="checked"> <span>全选</span&g...
2019-11-06 18:27:32
1029
原创 vue步骤条
<template> <div class="editInform"> <div class="testNav"> <div class="flow-item flow-item-3" @click="toTab(1)"> <div class="firstStep" :class="{'active':...
2019-11-01 11:12:06
1499
原创 面试题汇总
100万个成员的数组取第一个和最后一个有性能差距吗?参考链接:https://www.jqhtml.com/57474.html虚拟DOM参考链接:https://blog.csdn.net/suhuaiqiang_janlay/article/details/80256561...
2019-10-30 09:28:58
169
原创 vue 自定义地址设置@
在vue.config.js 中配置文件const path = require('path')function resolve (dir) { return path.join(__dirname, dir)}module.exports = { chainWebpack: config => { config.resolve.alias .set('@...
2019-10-23 11:12:16
2008
原创 vue-cli3中 vue.congig.js配置
const path = require('path');//引入path模块function resolve(dir){ return path.join(__dirname,dir) //path.join(__dirname)设置绝对路径}module.exports = { // 项目部署的基础路径 // 我们默认假设你的应用将会部署在域名的根部, /...
2019-10-23 10:44:53
311
原创 vue 注册全局的过滤器
1.编写一个全局的过滤器文件filter.jsfunction formatNumber(n) { const str = n.toString() return str[1] ? str : `0${str}`}function formatTime(date) { const year = date.getFullYear() const month = ...
2019-10-16 15:41:47
233
原创 vue 注册全局的组件
vue中组件的引用分为全局组件和局部组局1.关于局部组件的使用功能import A from '@/component/A'export default { data () {}, components: { A }}2.关于全局组将的引用1.新建一个全局组件的文件夹 globalComponents.jsimport ComponentA from '@/comp...
2019-10-16 15:38:37
409
原创 vue注册全局的工具方法
第一种方法: 全局引入文件先定义共用组件 common.vue// 定义一些公共的属性和方法 const httpUrl = 'http://39.105.17.99:8080/' function commonFun() { console.log("公共方法") } // 暴露出这些属性和方法 export default { ...
2019-10-16 15:37:32
1428
原创 vue全局的mixin使用和局部mixin使用
局部使用mixin官方解释: https://cn.vuejs.org/v2/guide/mixins.html定义一个 js 文件(mixin.js)export default {data() { return { name: 'mixin' }},created() { console.log('mixin...', this.name);},mount...
2019-10-16 15:35:50
1515
原创 js对象数组(JSON) 根据某个共同字段 分组
第一种:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <script> var arr = [{ name: 'sxy', ...
2019-10-15 13:37:08
310
原创 vue 路由前进和后退界面刷新
问题描述: 点击编辑按钮跳转到新界面,编辑之后保存跳转到原来的界面,这时候原来的界面没有刷新, this.$router.back(-1); 返回到上一个界面用watch 监听路由的变化,通过监听路由的变化,从新加载数据 watch: { $route(to) { if (to.path === '/panDian') { this.ajaxLoadDat...
2019-10-11 16:51:58
1581
原创 es6合并数组,去掉重复的数据
function combine() { let arr = [].concat.apply([], arguments); //没有去重复的新数组 return Array.from(new Set(arr));}var m = [1, 2, 2], n = [2, 3, 3];console.log(combine(m, n)); // [1,2,3]...
2019-10-10 17:26:08
3337
原创 css超出隐藏
CSS多行文字超出隐藏加省略号overflow: hidden;text-overflow:ellipsis;white-space: nowrap;限制行数overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertica...
2019-09-20 10:16:14
1659
原创 git 添加忽略文件
新建的文件在git中会有缓存,如果某些文件已经被纳入了版本管理中,就算是在.gitignore中已经声明了忽略路径也是不起作用的,这时候我们就应该先把本地缓存删除,然后再进行git的push,这样就不会出现忽略的文件了。git清除本地缓存命令如下:git rm -r --cached .git add .git commit -m 'update .gitignore’.gitignore...
2019-08-22 10:54:28
229
原创 vue install 注册全局组件
项目中的有些组件使用的频率比较高,这时候我们可以注册全局的组件,这样就不用每次使用的组件的时候一次次的导入具体使用的步骤如下一般会把这个常用的组件在main.js文件中注册好1.首先先建立一个公用的组件// Cmponent.vue 公用的组件<template> <div> 我是组件 </div></templ...
2019-07-19 18:20:55
17855
原创 vue mixin的用法
mixin这个方法最近在看文档的时候遇见了,对于这个方法的理解是这样的: 把一些公用的方法和数据放在Mixin这个js里面,这样的话,我们再使用的时候就可以直接用,而不用声明1.如果是全局都要使用的话,可以再main.js引入,作为一个去全局的方法使用import mixin from '@plugins/mixins';// 全局挂载utilsVue.use(install);2.按...
2019-07-19 16:43:57
495
原创 vue tab切换
<template> <div class="editInform"> <div class="testNav"> <div :class="{'selected':tab === 1}" class="tabItem baseInfo"> ① &...
2019-07-18 14:30:00
149
原创 数组方法归类
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title</title> </head> <body> <script> 数组常见的一些用法: push : 添加元素到数组的末尾; pop : ...
2019-07-01 14:37:50
197
原创 从当前时间开始,三天之内倒计时
搜索关键词 : (关键词 JS实现倒计时(天数,时,分,秒))<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <div id="timer"></...
2019-07-01 11:59:58
2230
原创 es5总结
数组的总结1,Array.from()的一些用法 (方法从一个类似数组或可迭代对象中创建一个新的,浅拷贝的数组实例。) (1)把字符串转化为数组 Array.from('foo'); // ["f", "o", "o"] (2)Array.from () 使用箭头函数 Array.from([1, 2, 3], x => x + x); // [2, 4, ...
2019-07-01 11:21:54
128
原创 订单超过一小时自动关闭 倒数计
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>动态显示时间</title> <script src="jquery-3.3.1.min.js"></script> ...
2019-06-27 18:29:46
1064
原创 git提交代码使用指南
一, 安装git之后先配置用户信息$ git config --global user.name "John Doe"$ git config --global user.email johndoe@example.com二, 建立git版本仓库方法一:执行git init 初始化一个版本仓库$ git init;方法二:克隆现有的仓库git clone ‘地址’git a...
2019-06-27 10:54:24
152
原创 小程序 时间戳转换的兼容ios
今天写的小程序的时候遇到一个很奇怪的问题,这里记录一下,下次遇到同样的问题就可以快速的结局了参考链接: https://blog.csdn.net/qq_33237207/article/details/80761480问题具体的是如上这样在ios上显示的不兼容,在ios和pc上调试都是可以正常的显示的that.leftTimer(responseData.doneTime.repla...
2019-06-20 18:04:11
447
原创 sort()方法的理解
这里主要记录一下自己对sort排序中的困惑的点官方的解释是这酱紫的:若 a 小于 b,在排序后的数组中 a 应该出现在 b 之前,则返回一个小于 0 的值。若 a 等于 b,则返回 0。若 a 大于 b,则返回一个大于 0 的值。对于sort()的理解,不管是升序排列还是降序排列,记住一句话: 大于0不改变位置,小于0改变位置对sort的用法,这里分为传参数和不传参数 1. 不传参数...
2019-06-19 18:13:38
1214
原创 关于移动端适配
第一步:首先在我们的html页面中引入meta标签<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">第二步:在html中引入rem.js的适配具体代码如下// 给予1rem = 100px;换算;(function...
2019-06-03 17:49:39
154
转载 浏览器窗口高度
参考文章:http://mp.weixin.qq.com/s?__biz=Mzg5ODA5NTM1Mw==&mid=2247483911&idx=1&sn=beddddaffcc0de9fd8a36ae6128488b6&chksm=c0668391f7110a87d27723d05091d366f2a82b810cfe761c989c6e8d5486c3d435e...
2019-05-21 09:45:54
2030
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人