Vue-使用Echarts做一个中国疫情地图demo 安装echarts包后如果包内没有 echarts/map/js/china.js 这个文件夹访问echarts/china包下载引入Vue页面代码如下直接复制,运行项目<template> <div class="hello"> <!-- echarts 初始化 --> <div class="content" ref="mapbox"></div> </div></tem.
Vue-前端自己导出表格为xlsx 格式 download-mixins.jsvar XLSX = require('xlsx');var FileSaver = require('file-saver');export const downloadMixins = { data: {}, methods: { btn_export(id, fileName) { var table1 = document.querySelector(id); var she.
css 实现菱形 <!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>菱
Echarts 初始化TypeError: Cannot read properties of undefined (reading ‘init‘) 导入echarts时用:import echarts from ‘echarts’ 出现 “Cannot read property ‘init’ of undefined” 报错,改成 import * as echarts from ‘echarts’ 后解决。
Canvas 获取上传视频第一帧图片当封面 安卓-IOS可能存在兼容性问题导致出现截取黑色背景图//截取视频第一帧作为播放前默认图片 findvideocover(obj) { // const videoList = document.querySelectorAll('.videoList') // console.log(videoList); const video = document.getElementById(`upvideo${this.videoList.length - 1}`).
canvas 实现图片添加水印 1.使用canvas来实现图片添加水印(也包括上传图片后显示水印~)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initia.
Vue solt插槽子组件像父组件传值 子组件 传递一个id 到父组件在<template> <div class="task-list"> <div class="task-box" v-for="(item, index) in list" :key="index"> <div> {{item.name}} </div> <div class="handleField"> <.
2021-06-15 Element 上传组件获取本地地址 :on-change 事件触发handleChange(file) { console.log(file); console.log('file', URL.createObjectURL(file.raw)); this.image = URL.createObjectURL(file.raw) },
JS 创建a标签并触发href事件 在此记录一下var a = document.createElement('a'); a.setAttribute('href', href); a.setAttribute('target', '_blank'); a.setAttribute('id', 'startTelMedicine'); // 防止反复添加 if (document.getElementById('startTelMedicine')) {
Vue 左边菜单跟右边列表进行位置联动 scrollTop 小demo 记录一下 点击左边 右边出现对应的列表内容 滑动右边左边出现对应的索引值左边列表css 时间线 记录一下<template> <div class="el-courtWrap"> <el-row class="el-left"> <div id="time-line"> <div class="item" v-for="(item, index)..
Vue+Element ui上传图片限制图片尺寸 1.引入element-ui upload组件<el-upload class="avatar-uploader" :headers="myHeaders" :action="上传图片的地址" :show-file-list="false" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload"> <img v-if="imageUrl" :src="imageUrl" class="avatar".
Vue Element Cascader 级联选择器 修改页面时候选择的节点回显问题 根据当时修改页面 对Cascader 选择器进行节点的回显遇到的问题所以闲暇整理了一个小demo ,直接上代码里面也都有注释<template> <div> <el-col :span="8"> <el-select v-model="nodeId" placeholder="请选择"> <el-option v-for="item in idOptions" :key="item.id" :label=".
js处理数组对象把相同的值归类 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc