- 博客(37)
- 收藏
- 关注
原创 前端动画requestAnimationFrame
告诉浏览器——你希望执行一个动画,并且要求浏览器在下次重绘之前调用指定的回调函数更新动画。该方法需要传入一个回调函数作为参数,该回调函数会在浏览器下一次重绘之前执行。备注若你想在浏览器下次重绘之前继续更新下一帧动画,那么回调函数自身必须再次调用。是一次性的。当你准备更新在屏动画时你应该调用此方法。这将使浏览器在下一次重绘之前调用你传入给该方法的动画函数(即你的回调函数)。回调函数执行次数通常是每秒 60 次,但在大多数遵循 W3C 建议的浏览器中,回调函数执行次数通常与浏览器屏幕刷新次数相匹配。
2024-05-11 10:39:57
486
原创 【vxml图片裁剪】
此元素用于绘制已从外部源加载的图像。有一个与图像大小相同的隐式矩形。任何笔划或填充都应用于此隐含矩形。笔划在图像顶部绘制。填充位于图像后面,因此仅通过图像的透明区域可见。图像透明度要么在 文件中编码,要么使用色度属性通过颜色值定义。与 imagedata 元素不同,imagedata 元素应具有父元素。
2023-02-21 10:48:42
135
原创 视频缩略图video.js videojs-vtt-thumbnails
安装npm install --save videojs-vtt-thumbnails引用import videojs from "video.js";import "../../../../assets/js/videojs-vtt-thumbnails";import "video.js/dist/video-js.css";import "../../../../assets/css/videojs-vtt-thumbnails.css";使用 const player
2021-12-06 13:34:15
793
原创 videojs-markers(视频打点)使用
安装npm install videojs-markers引入videojs-markersimport videojs from "video.js";import "video.js/dist/video-js.css";import "videojs-markers";import "videojs-markers/dist/videojs.markers.css";使用// 初始化video.jsconst player = videojs('test_vid..
2021-12-06 11:00:42
3800
4
原创 ······省略显示富文本段落中文字
富文本某一颜色字数超长时·····显示,例如:哈哈哈哈哈哈哈哈哈哈或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或,或或哈哈哈哈哈哈哈哈哈哈或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或或,这样显示会过长,显示成哈哈哈哈哈哈哈哈哈哈或或······或或或或或或或或或或或或或或,或或哈哈哈哈哈哈哈哈哈哈或或······或或或或或或或或或或或或或或或或。段落中可能出现多段带有颜色的字体,想每段带有颜色字体都能省略
2021-12-03 18:05:27
260
原创 zwibbler react使用
zwibblerjs地址:https://zwibbler.com/zwibbler-demo.js官网:Zwibbler: The Javascript Whiteboard that lets users Draw on your Websitereact使用import React from "react";import "../../../../assets/js/zwibbler-demo.js";let { Zwibbler } = window;let canvas
2021-11-01 14:38:05
417
原创 canvas截取视频当前播放截图
function captureVideoFrame() { const videoObj = document.getElementById("video_html5_api");// video.js video的id const canvas = document.createElement("canvas"); canvas.width = videoObj.videoWidth;// 获取视频的宽高 canvas.height = videoObj.vide...
2021-11-01 14:16:53
437
原创 分隔条上下拖动 原生js
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <title.
2020-10-21 15:01:58
546
原创 react hooks子组件向父组件传参
子组件import React, { useState, useContext } from 'react';import { ChildrenContext } from '../index';import { Button } from 'antd';export const Children= (props) => { const { setParent } = props; const baseval = useContext(ChildrenContext);.
2020-10-09 18:54:51
5945
2
原创 继承
function Animal(color){ this.color=color;}Animal.prototype.move=function(){}function Dog(color,name){ Aniaml.call(this,color); this.name=name;}function temp(){}temp.prototype=Animal.prototypeDog.prototype=new temp();Dog.prototype.co.
2020-07-28 10:32:40
126
原创 js按照指定顺序排序
let order = ['其他','0'] let tableData=[{name:'0'},{name:'其他'}] tableData = data.sort((a, b) => { return order.indexOf(a.name) - order.indexOf(b.name) })
2020-06-01 15:43:08
1731
1
原创 React使用docker传环境变量
Dockerfile文件内容 # => Build containerFROM node:alpine as builderWORKDIR /appCOPY app/package.json .COPY app/yarn.lock .RUN yarn config set registry https://registry.npm.taobao.org -gRUN yarn config set sass_binary_site http://cdn.npm.taobao.org/d
2020-06-01 14:55:47
1276
原创 VUE使用docker传环境变量
项目需要在打包后,部署安装的时候传环境变量。 Dockerfile内容,API_BASE_URL为传入vue的环境变量。 FROM node:alpine as builderWORKDIR /app# 格式为 WORKDIR <工作目录路径>。# 使用 WORKDIR 指令可以来指定工作目录(或者称为当前目录),以后各层的当前目录就被改为指定的目录,如该目录不存在,WORKDIR 会帮你建立目录。COPY app/package-lock.json .COPY .
2020-06-01 14:45:41
4744
原创 vue将elementTable下载为Excell
安装import FileSaver from 'file-saver'import XLSX from 'xlsx'Vue.prototype.$FileSaver = FileSaverVue.prototype.$XLSX = XLSX<template><!-- 下载为EXCEL --><span> <el-but...
2019-09-10 17:50:02
638
原创 websocket使用方法
let chatSocket = new WebSocket('ws://1.2.1.1:8001'); // WebSocket 对象作为一个构造函数,用于新建 WebSocket 实例 chatSocket.onopen = function (e) { // 用于指定连接成功后的回调函数 } chatSocket.onmessage = funct...
2019-08-06 15:04:11
250
原创 前端设置某个功能是否配置
在app首次加载的文件中写declare global { interface Window { _env_: any; }}window._env_ = window._env_ || {};window._env_.is_config= 'true';之后再在相应的地方设置是否配置此功能,true是,false否{window._env_.is_config ...
2019-08-06 14:51:35
200
原创 将blob返回值转为json数据
let data = error.response.data;if (error.request.responseType === 'blob') { var reader = new FileReader(); reader.readAsText(data, 'utf-8'); reader.onload = function () { data = JSON.parse...
2019-08-06 14:44:58
15767
6
原创 echarts的dataZoom点击事件
this.$echarts .init(document.getElementById('id')) .on('dataZoom', function (params) { })
2019-08-06 14:40:37
6373
1
原创 element-ui中Table表格合并单元格
<template> <div> <el-table :data="tableData" border :span-method="arraySpanMethod" style="width: 100%" > <el-table-column prop="id&
2019-02-19 13:36:24
1462
2
原创 echarts图表点击事件
this.$echarts.init(document.getElementById('myChart')) .on('click', function (params) { console.log(params) })
2019-02-19 12:58:52
1047
原创 vue-router传json数据刷新消失
1.传时 需JSON.stringify()this.$router.push({ name: 'HistoricalAchievement', params: { HistoricalAchievement: JSON.stringify(this.data) //HistoricalAchieveme...
2019-02-19 12:51:52
797
原创 iframe子页面与父页面通信
iframe子页面与父页面通信同域下父子页面的通信父页面parent.html<!DOCTYPE html><html lang="en"><head> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <me
2019-02-19 12:43:41
488
原创 git创建分支 与切换分支
git branch 查看当前属于哪个分支git branch +名称 创建分支git checkout +名称 切换分支git checkout -b +名称 创建并切换分支
2018-07-18 19:09:23
5080
原创 element更改表头样式
想要更改表头颜色,只要在el-table里引 :header-cell-style="{background:'red'}",<el-table :header-cell-style="{background:'red'}"></el-table>这样就可以了,或者使用函数 <el-table :data="tableData" ...
2018-07-18 18:41:57
28294
2
原创 在vuex里调接口
在vuex里的store.js里写const actions = { getWorkCount(content){ Axios.post("PlanTask/GetPlanTaskNum.do", {}).then(res => { content.state.fiaworkfiow=res.data.data.fiaworkfiow, }); ...
2018-07-17 15:39:26
2881
原创 原生js转换日期格式
var format = function(time, format){ var t = new Date(time); var tf = function(i){return (i < 10 ? '0' : '') + i}; return format.replace(/yyyy|MM|dd|HH|mm|ss/g, function(a){ ...
2018-07-17 15:12:31
684
原创 vue甘特图上调接口
vue甘特图单击‘’+‘’是创建任务,双击任务栏是更新,在图上操作也会识别,链接的线双击会出现删除提示 gantt.attachEvent('onAfterTaskAdd', (id, task) => {//创建任务this.$emit('task-updated', id, 'inserted', task)var params2 = new URLSearchPar...
2018-07-17 15:05:30
1089
原创 vue甘特图数据格式与各属性含义
tasks: { data: [ { text: 'Test001-001',//任务名 start_date: '19-04-2017',//开始时间 id: 1,//任务id duration: 13,//任务时长,从start_date开始计算 progress: 0.6,//任务完成情况,进度 ...
2018-07-06 15:41:42
2439
原创 甘特图vue查看方式
甘特图查看方式:按天查看,按月查看,按年查看,按周查看 <el-select v-model="value6" size="mini" placeholder="请选择" style="width:110px;" @change="chakan"> <el-option value="按天查看" class="sc
2018-07-06 15:17:30
2404
1
翻译 vue甘特图
npm install dhtmlx-gantt --save安装甘特图到自己的项目内之后可以创建一个vue文件<template> <div ref="gantt"></div></template><script>import 'dhtmlx-gantt'export default { name: 'gantt',...
2018-07-06 15:11:44
7297
2
转载 页面浏览pdf或图片iframe
<iframe :src="1.pdf" style="width:100%;height:100%;border:none;margin-top:10px;"> <a href="/index.pdf">Download PDF</a> </iframe>属性new : HTML5 中的新属性。
2018-07-06 14:55:16
1391
原创 element-ui分页在vue中的使用
<li v-for="(num,value) in pageTableData"></li> <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :curr...
2018-07-06 14:43:00
1197
原创 js或jQuery将页面生成图片
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>htmltopic</title> <!-- <script type="text/javascript" src="/h5/js/
2018-07-06 14:21:53
10935
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人