- 博客(52)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 公共组件，打开两个标签页时， 数据不更新
问题原因：因为两个路由都渲染同个组件，比起销毁再创建，复用则显得更加高效。不过，这也意味着组件的生命周期钩子不会再被调用。解决方法：//方案一（推荐）watch: { $route(to, from) { this.XXXX(); // 再次获取数据 } }//方案二（）路由跳转绑定唯一的key值如 xxx/6 xxx/7...
2022-03-14 13:23:15
253
原创 element-ui中的中国省市区级联选择器
npm install element-china-area-data -S 或cnpm install element-china-area-data -S导入以vue-cli创建的项目为例，在vue文件中的scrit标签内导入数据：import { regionData, CodeToText } from "element-china-area-data";使用如下代码所示：<template> <div id="app"> <d.
2022-02-18 17:44:37
2238
原创 数据封装处理大全
1.解析地址参数// 解析地址参数function GetParentQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); var url = window.name; console.log(url, "打印"); // var url = document.referrer; localStorage.setItem("tdurl", url); va.
2021-07-21 14:12:05
237
原创 es6 简介
ES6ECMAScript 6 简介ECMAScript 6.0（以下简称 ES6）是 JavaScript 语言的下一代标准，已经在 2015 年 6 月正式发布了。它的目标，是使得 JavaScript 语言可以用来编写复杂的大型应用程序，成为企业级开发语言。ECMAScript 和 JavaScript 的关系一个常见的问题是，ECMAScript 和 JavaScript 到底是什么关系？要讲清楚这个问题，需要回顾历史。1996 年 11 月，JavaScript 的创造者 Netsc
2021-06-23 12:04:08
426
转载 Git 教程
入门教程git入门教程展示帮助信息git help -gThe command output as below:The common Git guides are: attributes Defining attributes per path cli Git command-line interface and conventions core-tutorial A Git core tutorial fo.
2021-06-23 10:27:59
130
转载 vue 如何在循环中 “监听“ 的绑定v-model数据
1.普通属性的值进行监听vue中提供了一个watch方法，它用于观察vue实列上的数据变动，来响应数据的变化。下面我们来分别学习下使用watch对对象的属性值进行监听，有如下几种，普通属性的监听，对象的属性值的监听。最后一种就是对input中的v-modle的动态数组的数据属性进行监听，最后一种不是使用watch来监听，本文的重点是最后一种的实现。在项目中会经常碰到使用v-model监听数据的。<!DOCTYPE html><html> <head> .
2021-06-22 13:38:15
2714
原创 vue解析表格数据成json,并且分片上传
这个不用说npm i XLSX -S然后解析<el-upload class="upload" action="" :multiple="false" :show-file-list="false" accept="csv, application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
2021-06-08 11:25:45
383
原创 子传父
内部发送 window.parent.postMessage(message, '*');外部监听接收window.addEventListener('message', function (e) { //let target = e.target; let data = e.data; console.log(data); if (true) {
2021-03-24 16:12:58
163
原创 element-ui实现动态菜单栏 并处理菜单栏折叠文本不隐藏问题
element-ui实现动态菜单栏 并处理菜单栏折叠文本不隐藏问题<template> <el-aside style="width: auto" > <!-- 导航 --> <el-menu :unique-opened="true" router class="el-menu-vertical-demo" @open="handleOpen" :default-active="defa
2021-03-11 18:05:54
1130
原创 vue传值方式
其实很简单很好理解，引用官网一句话：父子组件的关系可以总结为 prop 向下传递，事件向上传递。父组件通过 prop 给子组件下发数据，子组件通过事件给父组件发送消息。这里不包含同级组件父<template> <div> 父组件: <input type="text" v-model="name"> <br> <br> <!-- 引入子组件 --> <child :i
2021-01-06 16:31:21
124
原创 vue3.0+element 报Cannot read property ‘prototype‘ of undefined
写太多vue2.0项目了，3.0都出来这么长时间了，我还没用过，今天初体验一番。（之前都是听说坑很多，今天也遇到一个）防止旧版本脚手架影响项目，我先卸载老的 npm uninstall vue-cli -g //或者 yarn global remove vue-cli直接用最新的脚手架（Vue CLI 3的包名称由 vue-cli 改成了 @vue/cli）注: Vue CLI 3需要 nodeJs ≥ 8.9 cnpm install -g @vue/cli //yarn global .
2021-01-06 16:18:11
11434
9
原创 js如何准确获取当前页面url网址信息
在WEB开发中，时常会用到javascript来获取当前页面的url网址信息，在这里是我的一些获取url信息的小总结。下面我们举例一个URL，然后获得它的各个组成部分：http://i.cnblogs.com/EditPosts.aspx?opt=11、window.location.href(设置或获取整个 URL 为字符串)var test = window.location.href;alert(test);返回：http://i.cnblogs.com/EditPosts.aspx?o
2020-12-03 15:08:16
139
原创 不同环境请求不同配置
// 不同环境的请求配置const prodConfigs = { // 开发环境 'xia.8688sdk.com': { DOMAIN: '', baseURL: "http://dev.surprisejk.8688sdk.com", url:'http://dev.img01.8688sdk.com/', Bucket: 'test-1302919045', down
2020-12-03 13:58:16
257
原创 vue使用百度富文本教程
众所周知，富文本插件市面上多的很，国外的我们不谈，国内的也多如牛毛！！不得不说的是，百度自家的产品还是很不错的》》虽然早就不维护了。也比一些小流的好用，功能全。虽然操作起来复杂的多直接贴代码引入就不废话了，直接全局挂载引入import '../static/ue/ueditor.config.js'import '../static/ue/ueditor.all.js'import '../static/ue/lang/zh-cn/zh-cn.js'import '../static/ue
2020-12-03 12:02:30
902
1
原创 vue 使用 cos上传，完美解决！！！！！
说到vue使用cos上传，还是因为我们的一次服务器大规模迁移。公司服务器阿里云迁往腾讯云。因为我之前发布过一个不使用第三方官方sdk上传的功能，代码贴的很细致，有兴趣的可以自己爬楼找一找。好了废话不多说，开始大家最感兴趣的，贴代码！！！ （cos-js-sdk-v5.min.js自己下载去,别下错了！！！下错了，会各种报错，实在找不到，叫我，我给你找！！！！）<!DOCTYPE html><html> <head> <meta charset=
2020-11-27 12:43:11
6777
13
原创 iframe中document.referrer无法取到完整url
今天发生了一件特别奇怪的事，特意记录下来，以供后续查看。测试同事反映说，使用chrome和Safari浏览器，打开线上的服务发现有问题。经检测发现，是iframe中的js文件中的函数，使用document.referrer获取外部文档的url竟然只能取到域名，其它的全取不到了，当时感觉特别奇怪，十一假期之前，还没有任何问题，结果放完假一上班就出现问题。然后就是一通折腾，发现chrome和safri都有问题，检查chrome版本，发现是86.开头的，同事的是85.开头的，都出现了同样的问题，结果装了个低版本
2020-10-29 11:06:58
3303
2
原创 element ui菜单栏动态渲染
直接上代码，模块清晰，自己赋值粘贴都行<el-menu :default-active="this.$route.path" :unique-opened="true" router class="el-menu-vertical-demo" background-color="#393e46" text-color="#fff" active-text-color="#4480e9" .
2020-08-24 17:35:39
3299
6
原创 如何在localStorage中存取数组，对象
1.首先你要知道localStorage只能存取字符串！！！！！那么如何存取数组/对象呢转存let newlist = []localStorage.setItem('recent', JSON.stringify(newlist))取用let list = JSON.parse(localStorage.getItem('recent'))
2020-08-24 17:19:44
1698
原创 vue 分片上传大文件，后端php接收合并
项目需要用到上传大文件功能，文件可能好几个G。传统的上传文件会有问题，所以自己找了一个php的实现方式，自己改到vue里面。废话不多说，这里是github上面的php dome 需要的可前往自行查看1.方式二、直接vue 的项目 index.html 里面引入 aetherupload.js spark-md5.min.js 还有 jq (因为他的aetherupload是jq写的请求，我懒得改，就直接引入了) 找不到index.html的同学，看你vue是什么版本的，是3
2020-08-19 10:24:01
1308
1
原创 element ui dialog 表单点击编辑，再点击添加，数据无法清空问题 解决办法
问题原因分析vue element ui在做编辑和添加时候通常使用一个dialog 弹框，这样就会出现一个问题，点击编辑 再点击添加，这时候数据已经赋值了， 所以this.$refs[formName].resetFields()，无法把数据重置为空[] 这肯定不是我们想要的结果，后面是这样解决的，在点击添加按钮的时候解决方式element Ui新增表单的时候，表单默认数据是新增get_new_data,编辑的时候表单默认数据是get_edit_data,这两个数据只能填一个，根据当前状态（
2020-08-07 09:43:44
4544
5
原创 html中如何去掉浏览器右边的滚动条
<body style="overflow-x: hidden"> 表示去掉水平滚动条。<body style="overflow-y: hidden"> 表示去掉竖直滚动条。<body style="overflow-x:hidden;overflow-y:scroll"> 表示隐藏横向滚动条，显示纵向滚动条。<body style="ov
2020-07-27 15:06:02
1695
原创 Avoided redundant navigation to current location:
虽然此报错并不会影响项目运行，但是作为一个强迫症的码农的确受不了error，解决方法如下：方法1：在项目目录下运行 npm i vue-router@3.0 -S 将vue-router改为3.0版本即可；方法2：若不想更换版本解决方法:在router.js中加入以下代码就可以记住插入的位置const originalPush = Router.prototype.pushRouter.prototype.push = function push(location) { return or
2020-07-09 16:56:54
3940
原创 iframe postMessage跨域传参
父<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <iframe src="http://xiawenyi/index.html" id="ifr" width="" height=""></iframe> <br /> <
2020-07-09 10:00:59
646
原创 iframe跨域获取的父页面URL
当iframe与父页面不属于同一个域名时，像上面的获取会因为安全策略原因而失败。在nczonline的一篇文章上看到一种方法，使用document.referrer。方法很简单，通过parent !=window检测iframe与父页面是否同源，当不同源时，使用document.referrer，否则使用parent.location.href或者top.location.href；var getParentUrl = function() { var url = null; if (
2020-07-07 15:56:05
6733
原创 Vue+Element ui中常用表单验证----手机号、座机、传真、邮箱、身份证号、数字和带小数点的数字
Vue+Element ui中常用表单验证----手机号、座机、传真、邮箱、身份证号、数字和带小数点的数字情景：最近为前端form表单提交时需要验证一下几种特殊的输入数据格式进行验证，在此记录一下。一：正则1.手机号：const reg = /^1[3|4|5|7|8][0-9]\d{8}$/;//11位手机号2.座机和传真：const reg = /^(\d{3,4}-)?\d{7,8}$/;//座机和传真格式是一样的：区号-号码3.邮箱：const reg = /^[a-z0-9
2020-07-07 15:50:43
3723
原创 window.open 在Safari中被拦截
原因：大部分现代的浏览器（Chrome/Firefox/IE 10+/Safari）都默认开启了阻止弹出窗口的策略，原因是window.open被广告商滥用，严重影响用户的使用。这个阻止弹出窗口的操作，并不是直接封杀window.open()，而是会根据用户的行为来判断这次window.open()是否属于流氓操作。如果是由用户触发的动作所引起的 window.open 就不会被浏览器所阻止，比如写在 onclick 这些事件 handler 里的，但如果是代码自己触发的就会被阻止。那么，我们可以知
2020-06-03 10:42:22
2523
3
原创 vue项目使用阿里无痕验证
<template> <div class="login"> <el-form-item style="width:300px;"> <el-button type="primary" @click="submitForm()" style="width:300px;height:50px;">登录</el-button> </el-form-item>
2020-06-01 13:26:28
3579
原创 记录一次vue3.0创建项目
这篇文章主要介绍下vue-cli3.0项目搭建，项目结构和配置等整理一下，分享给大家。一、介绍Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统。有三个组件：CLI：@vue/cli 全局安装的 npm 包，提供了终端里的vue命令（如：vue create 、vue serve 、vue ui 等命令）CLI 服务：@vue/cli-service是一个开发环境依赖。构建于 webpack 和 webpack-dev-server 之上（提供 如：serve、build 和 insp
2020-06-01 11:02:07
425
原创 数组转url
function filter(str) { str += ''; str = str.replace(/&/g, '%26'); str = str.replace(/\=/g, '%3D'); return str;}function formateObjToParamStr(paramObj) { const sdata = []; for (let ...
2020-05-08 11:10:30
1373
原创 vue js获取手机系统型号、版本、浏览器类型
1.index.html引入<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script><script src="https://cdn.jsdelivr.net/npm/mobile-detect@1.4.4/mobile-detect.min.js"></script>...
2020-05-08 10:47:17
7115
原创 VUE中使用UEditor百度富文本编辑器
我相信大家都能够对 vue 项目有了一个基本的认知。现在是不是已经开始上手做自己的项目了呢？呵呵，当然这是极好的。但是我们一般用 vue 来制作管理后台，在制作管理后台的时候，不可避免的，我们需要用到富文本编辑器。我尝试过 github 上的若干富文本编辑器，虽然能够实现一部分需求，但是还是不能充分满足我的需求。而百度推出的 UEditor 编辑器口碑不错，文档充分，还是很不错的选择（百度能有...
2020-04-15 11:53:04
1292
原创 VUE 利用 webpack 给生产环境和发布环境配置不同的接口地址
首先，我们分别找到下面的文件：/config/dev.env.js/config/prod.env.js其实，这两个文件就是针对生产环境和发布环境设置不同参数的文件。我们打开dev.en.js文件。代码如下：var merge = require('webpack-merge')var prodEnv = require('./prod.env')module.exports =...
2020-03-18 10:03:38
450
原创 时间戳转时间格式
filters: { formatDate: function(value) { // console.log('时间戳',value) value = `${value}000`; //如果后台传的value为10位数，则需要在后面加三个0. value = Number(value); let year = new Date(value)...
2020-01-08 10:34:13
141
原创 vue 点击按钮复制指定内容到剪切板，复制变量值到剪切板
1.安装插件npm install --save vue-clipboard2或cnpm install --save vue-clipboard2import Vue from 'vue' import VueClipboard from 'vue-clipboard2' Vue.use(VueClipboard)<template> <div cl...
2020-01-04 12:14:49
877
原创 vue element 表格根据后台返回的数据来决定展示数据还是可操作的按钮
vue element 表格根据后台返回的数据来决定展示数据还是可操作的按钮
2019-12-24 10:43:03
1538
转载 侧边栏与高度适应
js侧边栏在我新手时期，也写过许多的侧边栏，侧边栏的要求很简单，和屏幕高度保持一致，并且功能项能在内部进行滚动，当时的我也是煞费苦心，为了能够准确地自适应，不得不用js去进行实现$(window).resize(function(){ let sidebar = $('#dashboard-sidebar'); sidebar.css('height', 'auto'); ...
2019-12-03 15:40:07
1056
原创 复制粘贴
1、引入clipboard.js，方法如下： 第一种直接npm安装：npm install clipboard --save 第二种：<script src="js/clipboard.min.js"></script>（下载地址：https://clipboardjs.com/）2、在需要使用的组件中import 引用方法：import Clipboard ...
2019-10-19 16:21:28
145
转载 vue中class渲染颜色 多种只取一种
<template> <div class="hello"> <button @click="addFn">提交</button> <h1>{{msg}}</h1> <p :class="[sum[index]]">颜色</p> </div></...
2019-08-15 23:27:55
576
原创 Vue中对数值进行保留小数点后两位的处理
废话不多说，上代码vue渲染页面时，处理后台返还的数据！<div class="text primary-text"> <span>合计：</span> <span class="money">￥{{totalMoney | numFilter 这里是下面对应的值}}</span></div>toFixed方...
2019-08-15 12:13:00
30795
4
转载 vue 的点击事件怎么获取当前点击的元素
首先 vue的点击事件 是用 @click = “clickfun()” 属性 在html中绑定的,在点击的函数中 添加$event 参数就可以比如<button @click = “clickfun($event)”>点击</button>methods: { clickfun(e) { // e.target 是你当前点击的元素 ...
2019-08-10 16:29:43
11968
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人