web前端
qaakd
欢迎交流Web前端技术,相互学习
展开
-
使用vue-video-player实现直播
H5页面实现观看直播+视频回放;原创 2022-07-18 16:21:04 · 1801 阅读 · 0 评论 -
JS Object.assign,出现合并不了的正确做法
let obj2=Object.assign({},obj.sampleValues[0],this.form.sampleValues[0]);console.log(obj2);注意,第一个参数需要空对象原创 2022-06-06 15:36:34 · 320 阅读 · 0 评论 -
js一个对象的属性名是一个变量如何设置和获取值
this.$refs.refsDom.setData({ [key]:res[key], });[key]为变量名原创 2022-05-13 10:15:17 · 487 阅读 · 0 评论 -
VUE组件已经注册,但还是报错没有注册,解决方法
components: { viewWindow: () => import('../baseData/components/viewWindow'), },原创 2022-04-26 10:20:56 · 2880 阅读 · 0 评论 -
Vue如何定义全局函数
1.base.js:// base.jsexports.install = function(Vue, options) { Vue.prototype.text1 = function() { console.log('执行成功1'); }; Vue.prototype.text2 = function() { console.log('执行成功2'); };};2.main.js:import Vue from 'vue'; // vue要在引文件之前...原创 2022-04-25 14:51:34 · 1752 阅读 · 0 评论 -
JS递归算法例子
//计算 count(data) { if (data) { for (let i = 0; i < data.length; i++) { if (data[i].isRight == 1) { this.selectedKeys.push(data[i].id); ...原创 2022-02-15 09:43:01 · 383 阅读 · 0 评论 -
JS使用超链接打开本地文件
1. 创建一个.reg文件写入下面代码,并双击执行Windows Registry Editor Version 5.00[HKEY_CLASSES_ROOT\share]@="\"URL:share Protocol\"""URL Protocol"=""[HKEY_CLASSES_ROOT\share\DefaultIcon]@="window.exe,0"[HKEY_CLASSES_ROOT\share\shell]@=""[HKEY_CLASSES_ROOT\share\s原创 2022-01-25 22:10:46 · 1462 阅读 · 0 评论 -
Js日期加减(天数),时间加减,日期运算
根据传入的日期做加减法计算,整数为加法,负数为减法,但是是天。num可传入: 1,2,3,-1,-2,-3等,默认是加一天;date可传入: 2017-01-01格式的,不传的话默认是当天日期。function dateChange(num = 1,date = false) { if (!date) { date = new Date();//没有传入值时,默认是当前日期 date = date.getFullYear() + '-' + (date.getMonth()原创 2022-01-20 17:25:49 · 6989 阅读 · 0 评论 -
Js获取当前的日期和时间
<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>获取当前时间</title></head><body> <script type="text/javascript"> /** *获取当前时间 *format=1精确到天 *format=2精确到秒 ...原创 2022-01-20 11:03:45 · 716 阅读 · 0 评论 -
JS 比较年月日时间大少
//比较时间大少 comptime(beginTime,endTime) { // var beginTime = "2009-09-21 00:00:00"; // var endTime = "2009-09-21 00:00:01"; var beginTimes = beginTime.substring(0, 10).split('-'); ...原创 2022-01-17 10:49:10 · 116 阅读 · 0 评论 -
VUE打包部署到服务器的服务器配置(伪静态)
location / {try_files $uri $uri/ /index.html;}原创 2021-12-16 15:30:02 · 539 阅读 · 0 评论 -
vue 后台接口返回文件流地址的下载
接口:axios({url:api.path_3+'/getFile',method:'post',responseType:'blob' //注意这个一定要加})接口返回数据处理:download().then((res)=>{ //res为返回的数据letblob=newBlob([res],{typ...原创 2021-08-24 16:22:39 · 411 阅读 · 0 评论 -
VUE 引用Echats
1.先安装依赖:npm install echarts@4.9.02.完整带啊吗:<template> <div class="analyzeSystem"> <div :class="className" :id="id" :style="{ height: height, width: width }" ref="myEchart" ></div> </div>原创 2021-08-08 12:36:31 · 72 阅读 · 0 评论 -
VUE 打印
1.在main.js文件里加上:importPrintfrom'@/store/print'Vue.use(Print)//注册在线打印功能插件2.页面中调用:<template><section ref="print"> 打印内容 <div class="no-print">不要打印我</div></section></template>this.$print(this.$refs.prin...原创 2021-08-05 17:40:16 · 85 阅读 · 0 评论 -
js,简单的打印例子,自定义换页
<body> <input type="button" value="打印此页面" onclick="printpage()" /> <div id="printContent">打印内容</div> <script> function printpage() { let newstr = document.getElementById("printContent").innerHTML; le...原创 2021-08-05 15:08:32 · 309 阅读 · 0 评论 -
VUE导出数据为excel,xlsx
npm需要安装插件:npm install --save file-saver xlsx代码如下:<template><a-table:columns="columns":data-source="data"id="out-table"><aslot="name"slot-scope="text">{{text}}</a><spanslot="customTitle"><a-ic...原创 2021-07-31 17:09:08 · 111 阅读 · 0 评论 -
Vue 动态加载子组件
#### 父组件<template><component ref="detail":is="myComponent":showdevice="showdevice"@callBack="callBack"></component></template><script>export default {data () {return {myComponent: null,showdevice: { name: '传递的名字' }原创 2021-07-29 10:27:03 · 842 阅读 · 0 评论 -
vue element ui复杂表头,复杂表格
<template><div><el-table:data="tableData":span-method="arraySpanMethod"style="width:100%;margin-top:20px":header-cell-style="headerStyle"><el-table-columnprop="id"label="123"ref="pj"colspan="2"align...原创 2021-07-23 16:08:40 · 678 阅读 · 0 评论 -
VUE动态引入JS文件
leta=1;if(a==1){require('../../api/demo/demo.js');}else{require('../../api/demo/demo2.js');}原创 2021-06-21 15:01:16 · 814 阅读 · 0 评论 -
vue-element-admin 设置默认语言
https://blog.csdn.net/qq_39019865/article/details/104940897转载 2021-05-10 23:13:55 · 173 阅读 · 0 评论 -
VUE路由高亮或导航高亮(有图有真相,学无止境,欢迎交流)
navFlash.vue:<template> <div> <router-link to="navFlash" exact> <div> 导航1 </div> </router-link> <router-link to="navFlash2" exact> <div> 导航2 </div>原创 2021-05-09 23:16:50 · 245 阅读 · 0 评论 -
vue async await写法
methods: { // 获取所属地 getLocation(phoneNum) { return axois.post('/location', {phoneNum}); }, // 根据属地获取充值面额列表 getFaceList(province, city) { return axois.post('/location', {province, city}); }, // 采取async await 方式调用.转载 2021-01-16 03:14:01 · 502 阅读 · 0 评论 -
VUE 过滤器filters
Vue.js 允许你自定义过滤器,可被用于一些常见的文本格式化。过滤器可以用在两个地方:双花括号插值和v-bind表达式(后者从 2.1.0+ 开始支持)。过滤器应该被添加在 JavaScript 表达式的尾部,由“管道”符号指示:<!-- 在双花括号中 -->{{ message | capitalize }}<!-- 在 `v-bind` 中 --><div v-bind:id="rawId | formatId"></div>你可...原创 2021-01-15 23:24:55 · 150 阅读 · 0 评论 -
webpack解决打包出错的问题(版本太高导致打包出错)
下面看看如何正确的安装1.13.2第一步:如果有安装报错,最好先卸载 而且最好全局和文件夹内都卸载一遍npm uninstall webpack -g (全局卸载)确定npm正常 及安装了淘宝镜像第二步:全局安装 cnpm install -g webpack@1.13.2(经过测试,其他版本也可以,4.0以上的我就不确定了,貌似4.0的还是测试版)发现很多新手是上述安装问题都是因为直接npm 安装的最新版4.0以上的,然后按照此文章操作又直接安装成1.13.2版本了,虽然没问题..原创 2020-12-28 19:47:10 · 1044 阅读 · 0 评论 -
cube-ui官网不能访问的解决方法
在hosts文件中添加下面的配置就可以访问了185.199.109.153 didi.github.io转载 2020-12-20 14:18:23 · 1638 阅读 · 2 评论 -
ztree递归选中所有节点
Checked_j:function(node){ if(node.isParent){//判断是否为父节点 if(node.zAsync){//判断该节点是否异步加载过子节点(有木有展开) zTree = $.fn.zTree.getZTreeObj("treeDemo"); var childs = node.children; for(var i=0;i<c.原创 2020-12-08 10:41:18 · 588 阅读 · 0 评论 -
easyui的combobox点击框也能弹出选择框
$(".combo").click(function(){$(this).prev().combobox("showPanel");})原创 2020-11-27 16:27:47 · 393 阅读 · 0 评论 -
判断网站系统,当前页面是否为最顶层页面
function getTopWin(){ var p = window; while(p != p.parent){ p = p.parent; } return p;}原创 2020-11-13 17:07:24 · 392 阅读 · 0 评论 -
动态修改layui switch 状态 与获取layui switch的值
html部分:<div class="layui-form"><div class="layui-form-item"> <label class="layui-form-label">开关</label> <div class="layui-input-block"> <input class="test" type="checkbox" name="switch" lay-skin="switch.原创 2020-10-23 20:13:51 · 4843 阅读 · 1 评论 -
jq ajax设置请求头类型
$.ajax({ type: "POST", url: getRootPath() + "safeguardFacilitiesArmory/addOrEdit.do", data: data, //必须是字符串 dataType: "json", headers:{"content-type":"application/json;charset=utf-8"}, //请求头类型 success: function (res) { if (.原创 2020-10-21 20:13:50 · 1313 阅读 · 0 评论 -
iframe调用vue里的函数(iframe为子页面)
methods: {getShiBinList:function(){alert(1);},}mounted() { window.getShiBinList=this.getShiBinList; //给iframe调用}//以上是VUE里面的代码,iframe在vue里面// parent.getShiBinList();//调用vue里获取视频方法...原创 2020-10-10 09:36:29 · 2147 阅读 · 0 评论 -
jq上传文件真实进度条
$("#upForm").ajaxSubmit({ url:"/MultimediaTemplate/multimediaVideoFileUpload.do", type: "POST", dataType: 'json', processData: false, contentType: false, success: function (res) { $('#bj').hide(); $("#fileVideo").va.原创 2020-10-09 16:46:44 · 135 阅读 · 0 评论 -
触发元素事件 trigger
$('body').click(function(){ alert(1);});$('body').trigger('click'); //自动点击了body,并且触发单击事件<input type='text' id='test' value='大家好啊'/>$('#test').trigger('select'); //自动选择了ID为test的内容...原创 2020-10-09 15:37:56 · 371 阅读 · 0 评论 -
函数传递,函数封装
<html><head> <meta charset="utf-8"> <meta name="renderer" content="webkit|ie-comp|ie-stand"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=dev...原创 2020-09-18 15:50:35 · 147 阅读 · 0 评论 -
jq 限制上传文件的类型和大小
//限制上传文件的类型和大小function validate_img(ele){ // 返回 KB,保留小数点后两位 //alert((ele.files[0].size/(1024*1024)).toFixed(2)); var file = ele.value; if(!/.(gif|jpg|jpeg|png|GIF|JPG|bmp)$/.test(file)){ alert("图片类型必须是.gif,j...原创 2020-09-01 14:44:58 · 405 阅读 · 0 评论 -
js 根据屏幕大小改变字体大小.
<script src="jquery.min.js"></script><script>var width = document.documentElement.clientWidth; if (width > 750) { width = 750 } var fontSize = width/7.5 console.log(width) document.getElementsByTagName('html')[0].style['font-.原创 2020-08-31 10:20:46 · 1388 阅读 · 0 评论 -
判断IOS与安卓的下载
<script type="text/javascript">function panduan(){var u = navigator.userAgent;var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端if(isAndroid){ lo.原创 2020-08-28 17:10:30 · 182 阅读 · 0 评论 -
js导出excel(超简单)
代码如下复制即可:<html><head> <p style="font-size: 20px;color: red;">使用a标签方式将json导出csv文件</p> <button onclick='tableToExcel()'>导出</button></head><body> <script> function tableToExcel(...原创 2020-08-19 17:16:50 · 6184 阅读 · 4 评论 -
js input file 上传文件,判断文件类型(超简单)
<input type="file"accept=".mp4,.avi,.rmvb"/>ok,搞定。这样就限制了上传文件类型。原创 2020-08-14 16:39:33 · 4026 阅读 · 3 评论 -
Video.js实现播放rtmp流视频(100%完整运行)
效果图:原创 2020-08-13 11:11:44 · 4305 阅读 · 2 评论