- 博客(55)
- 收藏
- 关注
RSS订阅
原创 Vue2.0搭建脚手架（vue-cli）
Vue2.0搭建脚手架（vue-cli）安装node.js从node官网下载并安装node，安装只要一路“next”就可以了。 安装完成后，打开命令行工具输入命令node -v，如下图，如果出现对应版本号，就说明安装成功了。 —— [ node 官网]安装vue-cli脚手架构建工具vue-cli 提供一个官方命令行工具，可用于快速搭建大型单页应用。只需几分钟即可创...
2018-09-11 11:34:46
221
原创 js判断数组对象中某个属性的值是否为空，数字转成相对应的文字并显示
1、js判断数组对象中某个属性的值是否为空思路：循环数组对象，把其中值添加进一个空数组中，使用some方法：some() 方法用于检测数组中的元素是否满足指定条件，some() 方法会依次执行数组的每个元素：如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测，如果没有满足条件的元素，则返回false。代码： let arr = [ { id:'1', value:'苹果', }, {
2021-12-07 15:07:04
9823
转载 vue中异步函数async和await的理解与用法
先说一下async的用法，它作为一个关键字放到函数前面，用于表示函数是一个异步函数，因为async就是异步的意思， 异步函数也就意味着该函数的执行不会阻塞后面代码的执行。 写一个async 函数 async function timeout() { retur...
2021-04-21 16:44:10
856
1
转载 vue更新视图的方法 vue.set() (this.$set) 的用法
由于最近工作的时候大量操作对象数组，并且要求实时更新视图数据，这个时候首先想到的是 vue.set() 方法（注：当发现model上的数据发生改变，而页面上的视图数据没有改变，推荐使用该方法。）下面弄一个简单的案例<template> <div id="app2"> <p v-for="item in items" :key="item.id">{{item.message}}</p> <button clas
2021-01-22 15:48:28
330
原创 使用原生js、XMLHttpRequest实现下载文件（三种方式）
一、使用XMLHttpRequest，获取response 实现下载 let that = this; let params = { taskId: that.fieId }; let xhr = new XMLHttpRequest(); xhr.open('POST', '/ids/fap/session/pcap-expo
2020-12-11 09:41:42
7017
原创 element-ui+vue弹出多个message的问题处理
如果出现网络问题，刷新页面，或者有多个接口请求就会出现报错，那么提示就会连续弹出几个：解决方案：重写Message。弹出前判断是否有相同弹出框，若有则关闭它再弹出新的resetMessage.js：import {Message} from 'element-ui';let messageInstance = null;const resetMessage = (options) => { if(messageInstance) { messageInstance.
2020-07-07 16:05:31
2093
原创 密码正则表达式的整合
密码的正则表达式整合1、只能为纯数字 var reg = /^\d+$|^\d+[.]?\d+$/;2、只能为纯字母（不区分大小写） var reg = /^[a-zA-Z]+$/;3、只能为数字或者字母（不包含特殊字符） var reg = /^[0-9a-zA-Z]+$/;4、只能为数字的11位字符（不包含特殊字符以及字母） var reg = /^[0-9]{1...
2020-03-19 13:25:24
1485
原创 webStrom快捷键快速创建React组件模板
1、rcc + tab键 - - 用ES6模块系统创建一个React组件类2、rwwd + tab键 - - 在没有导入的情况下，在ES6模块系统中创建一个有构造函数、空状态、proptypes和导出的React组件类3、rccp + tab键 - - 创建一个带有PropTypes和ES6模块系统的React组件类4、rcfc + tab键 - - 创建一个带有PropTypes和所有生命...
2019-11-28 10:37:19
1164
1
原创 vue中JS实现内容上下无缝滚动效果
vue中JS实现内容上下无缝滚动效果现在有个需求当页面载入时实时接口风险板块的内容自动往上无缝滚动，当鼠标停留时滚动停止！我们开始写方法，在methods中写个scroll方法， 通过document.getElementById来获取当前元素，这里scrollTop获取被选元素的垂直滚动条位置，offsetHeight获取该控件本身的高度，然后设置一个定时器，给定一个时间，这样就实现了自动...
2019-11-13 15:32:32
4902
原创 在vue中使用vuex和sessionStorage管理数据
安装 vuexnpm install vuex --savevuex安装完成之后，在src文件下建个store文件夹下建个index.jsmain.js文件下注册：//实例化 storeimport store from './vuex/store.js'new Vue({ el: '#app', store, //实例化 store router, com...
2019-09-28 21:16:48
790
2
原创 Vue中的computed属性
Vue中的computed属性理解：1、computed用来监控自己定义的变量，该变量不在data里面声明，直接在computed里面定义，然后就可以在页面上进行双向数据绑定展示出结果或者用作其他处理；2、computed比较适合对多个变量或者对象进行处理后返回一个结果值，也就是数多个变量中的某一个值发生了变化则我们监控的这个值也就会发生变化，举例：购物车里面的商品列表和总金额之间的关系，只...
2019-09-19 15:32:56
147
原创 .gitignore忽略文件和规范
在git项目的根目录输入命令行：touch .gitignore 新建.gitignore文件touch .gitignore.gitignore文件的格式规范：# 此为注释 // 将被 Git 忽略*.a // 忽略所有 .a 结尾的文件/TODO //仅仅忽略项目根目录下的 TODO 文件，不包括 subdir/TODObuild/ ...
2019-07-12 10:51:41
123
转载 webstrom怎么配置git并提交
本文来自 李灏峰 的博客园全文地址请点击：https://www.cnblogs.com/jamie-web/p/git.html1.下载好webstorm和git.exe 2.在webstrorm里配置git的选项（安装git的路径）3.选择VCS选择检出git4.克隆线上的项目（项目的路径）5.修改的文件会显示蓝色的文件名6.点击鼠标右键进行提交修改7.写上...
2019-07-12 10:38:02
964
原创 vue中使用getUrlParam()方法来获取URL的值
首先建一个GetUrlParam.js，然后在需要的页面中引入使用：GetUrlParam.jsexport function getUrlParam(name) { return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.hr...
2019-07-10 10:01:24
3587
原创 vue-cli点击实现全屏功能(两种方式)
项目中有点击按钮实现全屏功能代码如下：<template> <div> <a-button type="primary" @click="screen">全屏</a-button> </div></template><script> export default { ...
2019-07-04 10:56:05
2999
2
原创 Vue-cli中 $ref 的基本用法
对于ref官方的解释是：ref 是被用来给元素或子组件注册引用信息的。引用信息将会注册在父组件的 $refs 对象上。我的解释：1、如果ref用在子组件上，指向的是组件实例，可以理解为对子组件的索引，通过$ref可能获取到在子组件里定义的属性和方法。2、如果ref在普通的 DOM 元素上使用，引用指向的就是 DOM 元素，通过$ref可能获取到该DOM 的属性集合，轻松访问到DOM元素，作用...
2019-06-28 22:07:20
871
原创 选择本地的图片当背景实现涂鸦功能
选择本地的图片当背景实现涂鸦功能<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> canvas{bor...
2019-06-18 09:18:20
414
原创 JS实现的base64加密解密和json对象和字符串的相互转换
JS实现的base64加密解密代码如下<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><script> var B...
2019-06-11 16:40:14
6791
1
原创 React基础项目搭建以及环境配置
1、首先，我们需要安装node.js：node.js官网安装nodejs稳定版本2、安装cnpm用cnpm替代npm地址：淘宝镜像地址 安装cnpm:npm install -g cnpm --registry=https://registry.npm.taobao.org3、用yarn替代npmyarn的安装：第一种方法：参考官方文档 yarn官方文档第二种方法：...
2019-05-06 11:17:04
222
原创 JQuery中Ajax的操作和原生js调用接口数据
原生js调用接口数据和JQuery中Ajax的调用接口原生js：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>js调接口</title></head><body><button ...
2019-04-16 10:28:33
2877
转载 Git撤销&回滚操作
开发过程中，你肯定会遇到这样的场景：场景一： 糟了，我刚把不想要的代码，commit到本地仓库中了，但是还没有做push操作！场景二： 彻底完了，刚线上更新的代码出现问题了，需要还原这次提交的代码！场景三： 刚才我发现之前的某次提交太愚蠢了，现在想要干掉它！撤销上述场景一，在未进行git push前的所有操作，都是在...
2019-04-03 10:42:35
134
转载 Git详细使用教程
预警：因为详细，所以行文有些长，新手边看边操作效果出乎你的预料）一：Git是什么？Git是目前世界上最先进的分布式版本控制系统。工作原理 / 流程：Workspace：工作区Index / Stage：暂存区Repository：仓库区（或本地仓库）Remote：远程仓库二：SVN与Git的最主要的区别？SVN是集中式版本控制系统，版本库是集中放在中央服务器的，而...
2019-04-03 10:38:17
96
转载 git学习-如何将本地项目上传（同步）到github远程仓库
原 git学习-如何将本地项目上传（同步）到github远程仓库 2018年05月26日 22:32:25 小·幸·运 阅读数：1050 ...
2019-03-04 16:10:19
377
原创 vue-cli中的this.$nextTick详解
官方介绍：将回调延迟到下次 DOM 更新循环之后执行。在修改数据之后立即使用它，然后等待 DOM 更新。它跟全局方法 Vue.nextTick 一样，不同的是回调的 this 自动绑定到调用它的实例上。理解：总结来说， 假设我们更改了某个dom元素内部的文本，而这时候我们想直接打印出这个被改变后的文本是需要dom更新之后才会实现的，也就好比我们将打印输出的代码放在setTimeout(fn,...
2019-02-22 14:57:31
933
原创 Vue2.0的传值方式：父传子、子传父
本文介绍传值方式：父传子、子传父父子组件的关系可以总结为 prop 向下传递，事件向上传递。父组件通过 prop 给子组件下发数据，子组件通过事件给父组件发送消息父组件向子组件进行传值父组件:<template> <div> 父组件: <input type="text" v-model="name"> <br>...
2019-02-15 14:28:09
208
原创 解决用了V-show 刷新的一瞬间可以看到隐藏的文字
做了一个组件页面，我用了一个v-show是判断，结果刷新时候会看到那个隐藏的内容<style> [v-cloak] { display: none; }</style><div id="app" v-cloak></div>这个指令保持在元素上直到关联实例结束编译。和 CSS 规则如 [v-c...
2019-02-14 15:05:19
990
原创 vue 过滤器基本用法以及封装过滤器
vue 过滤器基本用法理解：不改变data的数据格式，在界面显示处理后的数据格式比如：对数组中的日期进行截取整体代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title&g
2019-02-14 14:25:21
346
原创 JS正则截取两个字符串之间及字符串前后内容的方法
JS正则截取两个字符串之间及字符串前后内容的方法：js截取两个字符串之间的内容： var str = "aaabbbcccdddeeefff"; str = str.match(/aaa(\S*)fff/)[1]; console.log(str);//结果bbbcccdddeeejs截取某个字符串前面的内容：var str = "aaabbbcccdddeeefff";st...
2019-02-08 12:34:16
1526
原创 在vue中使用vuex和sessionStorage保存用户名
安装 vuexnpm install vuex --savevuex安装完成之后，构建如下目录：main.js文件下注册：//实例化 storeimport store from './vuex/store.js'new Vue({ el: '#app', store, //实例化 store router, components: { App }, ...
2019-01-25 14:22:09
7536
4
原创 封装getQueryString()方法来获取URL的值
封装getQueryString()方法来获取URL的值代码实例：<script> //获取URL参数 function getQueryString(name) { var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i'); var r = window...
2019-01-24 09:37:13
672
原创 vue.js结合mui框架后picker（选择器）的使用
vue.js结合mui框架后picker（选择器）的使用效果图：示例一示例二示例三引入的mui和vue.js： <link rel="stylesheet" href="css/mui.min.css"> <link rel="stylesheet" type="text/css" href="css/mui.picker.m
2019-01-17 16:49:29
4956
原创 vue.js写个选择多条数据的和查询功能
效果图如下：需求是：1、点击input框后选择审核人列表菜单过渡从下往上出现；2、选择人后点击确定按钮，选择的人出现在input框中；3、点击空白的地方则关闭选择审核人窗口代码如下：&amp;amp;amp;amp;lt;!DOCTYPE html&amp;amp;amp;amp;gt;&amp;amp;amp;amp;lt;html lang=&amp;amp;amp;quot;en&amp;amp;amp;q
2019-01-17 12:02:02
3810
原创 Vue.js进行查询操作的实例
Vue.js写个查询功能代码如下：&amp;amp;lt;!DOCTYPE html&amp;amp;gt;&amp;amp;lt;html lang=&amp;quot;en&amp;quot;&amp;amp;gt;&amp;amp;lt;head&amp;amp;gt; &amp;amp;lt;meta charset=&amp
2019-01-17 10:16:56
10253
1
原创 在vue-cli中使用iview组件上传多个文件的功能
在vue-cli中使用iview组件上传多个文件的功能思路：创建一个数组 把需要上传的文件 push到这个数组里面需求：点击提交按钮把上传后得文件URL地址当做参数传给后台；多个文件使用逗号隔开样式随便写的，自己做的demohtml代码<template> <div> <Upload ref="upload" mu...
2019-01-11 17:03:18
2971
1
原创 使用jquery的file提交文件上传
使用jquery的ajax提交文件上传我们都知道ajax不能传递文件，但是html新出的一个formdata可以。我首先想到的就是这个方法点击提交上传代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title
2019-01-11 10:18:58
2797
原创 vue-cli中使用vue-router切换页面时自动滚动到顶部的方法
vue-cli中使用vue-router切换页面时自动滚动到顶部的方法解决办法：在 Vue项目的main.js文件中加入以下代码即可解决：//页面跳转显示在顶部router.afterEach((to,from,next) => { window.scrollTo(0,0); })有时候这样解决出现的问题：1.scrollTo方法部分在手机上的部分浏览器不支持，也就是...
2019-01-10 16:52:39
646
原创 vue中打包后出现css中文本超出部分隐藏显示省略号失效
一般使用下面这段css代码来让文字超出范围隐藏并显示省略号： overflow: hidden; /*超出的文本隐藏*/ text-overflow: ellipsis; /* 溢出用省略号*/ display: -webkit-box; /*作为弹性伸缩盒子模型显示*/ -webkit-line-clamp: 1; /*显示的行数；如果要设置2行加...则设置为...
2019-01-10 15:57:46
1916
原创 Vue-cli 中为单独页面设置背景图片铺满全屏的方法
Vue-cli 中为单独页面添加张背景图片从而达到铺满全屏的方法<template> <div id="logo"> </div></template><script> import meadiaurl from '../../api/mediaurl' export default { ...
2019-01-10 15:43:32
20904
5
原创 Vue-cli中watch监听使用
Vue-cli中watch监听使用一下是Vue中watch的基本使用：<template> <div> <p>FullName: {{fullName}}</p> <p>FirstName: <input type="text" v-model="firstName">&
2019-01-08 21:17:07
3737
原创 vue-cli中把时间戳转化为日期格式和封装接口
vue-cli中把时间戳转化为日期格式封装一个date.js文件：export function formatDate (date, fmt) { if (/(y+)/.test(fmt)) { fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length)); } le...
2019-01-04 17:03:11
525
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人