- 博客(19)
- 收藏
- 关注
RSS订阅原创 Vue使用video.js播放m3u8视频流
Vue使用video.js播放m3u8视频流有这样一需求，播放视频流功能，也就是监控视频，让后端吧视频流格式转换m3u8；刚开始赚了很多种格式的 都不太支持，比如flv，rtsp，rtmp等格式，这些格式都不太行（也许是我太菜了）。一、安装video.js依赖npm install --save-dev video.js1、HTML部分代码，先给video一个容器，给一个id<video id="videoPlayer" class="video-js" muted></v
2022-02-14 16:21:58
3358
原创 Vue滚动菜单锚点功能
Vue滚动菜单锚点功能话不多说 直接上代码了1、HTML部分2、js部分mounted() { let timeId; window.addEventListener( "scroll", () => { // 页面滚动停止100毫秒后才会执行下面的函数。 clearTimeout(timeId); timeId = setTimeout(() => { this.scrol
2022-01-20 19:17:35
1819
原创 vue刻度尺组件
vue刻度尺组件最近一个需求，做一个填写个人信息，填写身高和体重时需要用到刻度尺，就找到该组件的使用方法。先看一下最后效果1、安装依赖npm install cs-ruler2、在main.js中引入import CsRuler from "cs-ruler";Vue.use(CsRuler);3、在vue文件中使用<cs-ruler @post-NumValue="handleWeight" //改方法实时监听你改变刻度尺的值 :NowNum="60" //当
2021-11-30 09:44:30
6395
2
原创 uni-app自定义配置安卓模拟器 - MuMu模拟器
第一步 ：下载MuMu模拟器下载地址：http://mumu.163.com/第二步 ： 配置模拟器端口以及abd路径，该路径在HBuilder安装目录中然后继续打开你的HBuilder编辑器，运行→运行到手机或模拟器→安卓模拟器端口配置第三步 ：配置系统变量在系统变量里面找path，新建添加刚才的adb路径第四步 ： 检验一下adb是否存在环境变量中这已经ok了第五步： 运行到MuMu模拟器中运行MuMu模拟器之前要先打开MuMu模拟器这就可以了，配置uniapp模拟器
2021-11-22 19:44:51
5070
9
原创 微信小程序安卓和ios时间格式问题
微信小程序安卓和ios时间格式问题微信小程序上做了一个需要获取现在的时间减去后端返回的一个时间，做一个动态进度条，开始没有考虑到时间问题上，上线之后安卓手机上有数据，ios上面没有数据，是因为获取的时间格式不一样。安卓上的时间格式是2021-11-22ios上的时间格式是2021/11/22安卓可以兼容ios的时间，但是ios上不能兼容安卓上的时间，所以只能把它转换为ios时间格式的 2021/11/22 let stopTime = new Date() //获取目前的时间 let y
2021-11-22 13:55:41
2782
原创 Vue返回时记录原来的滚动位置
记录滚动条的位置这样一个需求，做的管理平台有很多图片，往下面滑动的时候点击某一张图片会进入图片详情页面，返回的时候又回到了最上面，所以这样很麻烦，要做一个返回时还在刚才点击时候的位置。一、第一种方法 beforeRouteLeave(to, from, next) { //scroll要先在data里面赋值一个0 scroll:0 //el-main是你这个页面的主体class名称，写你自己的名称。 this.scroll = document.getElementsByClassN
2021-10-09 11:56:48
978
原创 Vue使用hightcharts中的韦恩图及报错解决方法
vue使用hightcharts韦恩图一、首先安装两个依赖npm install highcharts-vuenpm install highcharts --save二、在main.js中引入import HighchartsVue from "highcharts-vue";Vue.use(HighchartsVue);三、在组件里面调用<template> <div class="hello"> <div id="container">
2021-09-22 14:00:08
1911
原创 vue实现下载文件和图片功能
vue实现图片或文件下载功能今天一个需求就是实现图片下载功能，刚开始以为很简单没有什么逻辑可写，就以为调用后端接口就可以了，调用之后发现有问 题，看来还是没有想象的那么简单1、要自己创建一个a标签，以下就是下载功能的实现这里是调用接口之后如果code=200时进行下载if (res.code == 200) { const link = document.createElement("a"); //自己创建的a标签 link.href = res.data; d
2021-09-15 19:44:14
4350
原创 Vue按回车键进行搜索
Vue项目按回车键进行搜索最近有一个需求，为了用户方便进行搜索数据的时候不想点击搜索按钮，想要在表单内输入完成之后直接按回车键进行搜索。根据vue+ElementUUi完成。下面直接上代码1、现在el-input里面添加这一行代码@keyup.enter.native="seachEnter"2、写seachEnter事件seachEnter(e) { var keyCode = window.event ? e.keyCode : e.which; if (ke
2021-08-02 11:02:05
10208
2
原创 vue时间过滤器
vue时间过滤器有时候后端返回的数据并没有对时间做处理，需要我们前端来做处理，那么我们就加一个时间过滤器1、先安装插件npm install moment --save 2、在main.js中引入和使用//事件过滤器import moment from 'moment'Vue.filter('DateTime', function (value) { return moment(value).format('YYYY-MM-DD HH:mm:ss')})3、在页面中的使用
2021-06-08 14:05:04
731
原创 Vue点击跳转新窗口和修改窗口标题
Vue点击跳转新窗口和修改窗口标题这是最近的一个需求，直接上代码。一、跳转打开新窗口二、修改新窗口的标题1、首先在main.js中：2、在跳转到那个页面里面的最大的div里面：以上逻辑就可以实现跳转打开新窗口和修改新窗口的title以下就是效果，我这里是动态的改变新窗口title...
2021-05-06 16:30:55
2329
原创 前端导出多级表头
前端导出多级表头今天在技术交流群里面看到有人问到了这一块，我之前看过一些关于这样的代码，我就直接给他上了代码，自己又重新练习里一遍这是结合elementUI来写的一个表格。先看一下练习的是这样的效果首先还是要安装依赖npm install xlsx file-saver -Snpm install script-loader -S -D直接上代码1、需要一个Export2Excel.js文件/* eslint-disable */import { saveAs } from 'f
2021-04-12 16:59:04
1432
1
原创 打砖块小游戏
打砖块这是用原生js来写的一个打砖块小游戏，平时太闲了，没事就写了一个小游戏。感兴趣的小伙伴可以直接复制到自己电脑上玩一下这里有一个浏览器兼容问题，在谷歌浏览器上结束的时候点击确定不能够重新开始，在火狐浏览器上是没有问题的。下面直接上代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content=
2021-04-10 19:33:35
243
原创 关于小程序分包问题
小程序分包就这一个小问题，我弄得快一个星期了还没有解决，最后引起了老板的注意，每天都坐我旁边看着我来改。最后神不知鬼不觉的搞好了。改bug不是最头疼的问题，最头疼的是被老板一直盯着看，哈哈哈。之前第一次开发小程序的时候不知道分包的问题，开发完点击上传的时候才知道需要分包，上传的时候代码包超过了2M，报了以下错误当出现这个问题的时候我才懂得小程序主包代码不能超过2M，如果代码量比较大的话要使用分包来处理下面就是解决方法一、这些是tabBar页面的配置，tabBar页面必须要放在主包内的，
2021-04-09 17:08:24
939
4
原创 如何封装自己的组件
如何封装自己的组件相信有很多人在面试的时候都会被问到自己封装过什么组件（因为我就在面试的时候踩过这个坑），下面给大家说一下怎样封装怎么用这些组件1、为什么要封装组件呢？因为封装的组件会有很多页面用的到这个页面，需要用到的可以直接来引入使用，不用再每次再写一遍了，解决了代码冗余，这样更方便，也是我们的代码更有模块化。一、下面就是我封装的组件把封装好的组件放在components文件下二、引入和注册封装好的组件你在哪个页面可以使用到这个组件就在那个页面内引入三、使用该组件以上就是我自
2021-04-09 10:35:37
8210
1
原创 Vue如何导出execl表格
vue如何导出execl表格1、首先要有一个Export2Excel.js文件,Export2Excel.js文件/* eslint-disable */import { saveAs } from 'file-saver'import XLSX from 'xlsx'function generateArray(table) { var out = []; var rows = table.querySelectorAll('tr'); var ranges = []; fo
2021-04-08 10:41:06
368
3
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人