Vue
ANNENBERG
五道口职业技术学院
展开
-
页面广告飘窗
【代码】页面广告飘窗。原创 2024-07-16 23:57:42 · 113 阅读 · 0 评论 -
截图与打印
【代码】截图与打印。原创 2023-11-05 17:12:53 · 130 阅读 · 0 评论 -
截图并将图片导出为pdf
【代码】截图并将图片导出为pdf。原创 2023-11-05 17:12:07 · 115 阅读 · 0 评论 -
视频播放器 之vueplayer和flv.js
如果需要播放m3u8,还需安装npm i videojs-contrib-hls -S;如果需要播放rtmp,还需安装npm i videojs-flash -S;ps:autoplay: true 不能自动播放可能是窗口设置太小;当时安装的最新版(6.0.0)引入是报错,后改为。项目接入了海康的flv实时视频流(摄像头监控)原创 2023-03-19 11:09:54 · 1137 阅读 · 0 评论 -
vue关闭浏览器
/谷歌等其他浏览器。原创 2023-03-19 11:14:21 · 1364 阅读 · 0 评论 -
echarts实例的清空与销毁-clear/dispose
使用场景:当echarts图表的数据是动态更新然后渲染图表时,哪怕我们使用watch去监听了数据的变化,已经拿到了更新的数据,但是图表却没有进行相应的渲染,clear或dispose一下。内存溢出:当程序运行时需要的内存超出了当前应用系统的剩余内存时,就造成了内存溢出的情况,直观表现就是——卡死。dispose类似于v-if,它是将echarts对象清理了,然后重新构建echarts对象。echarts.clear()是清空当前实例,会移除实例中所有的组件和图表。原创 2023-01-12 11:19:48 · 21985 阅读 · 0 评论 -
vue-自定义指令设置及常用自定义指令
Vue自定义指令有全局注册和局部注册两种方式。先来看看注册全局指令的方式,通过方式注册全局指令。然后在入口文件中进行Vue.use()调用。批量注册指令,新建文件在main.js引入并调用下面分享几个实用的 Vue 自定义指令v-copyv-debouncev-emojiv-LazyLoad。...原创 2022-08-09 23:22:56 · 1043 阅读 · 0 评论 -
vue-click事件
click.self事件只作用在元素本身,而不是其子元素。@click.prevent阻止事件默认行为。@click.stop阻止事件冒泡。@click.native组件事件。原创 2022-07-16 17:10:02 · 1396 阅读 · 0 评论 -
页面导出为word-两中方法
参考来源,导出出word,excel,pdf原创 2022-03-03 16:19:50 · 1123 阅读 · 0 评论 -
时间格式化
// 参数number为毫秒时间戳,format为需要转换成的日期格式export function formatTime (number, format) {let time = new Date(number)let newArr = []let formatArr = ['Y', 'M', 'D', 'h', 'm', 's', 'i']newArr.push(time.getFullYear())newArr.push(formatNumber(time.getMonth()原创 2022-03-03 10:32:39 · 196 阅读 · 0 评论 -
vue中activated
keep-alive<keep-alive>包裹动态组件的时候,会缓存不活动的组件实例,而不是摧毁他们。其是一个抽象的组件,自身不会渲染一个DOM元素,也不会出现在父组件链中。说白了被<keep-alive>包裹的组件其会被缓存。没有被<keep-alive>包裹的话,activated是不起作用的我们现在创建两个子组件conpoment1,compoment2,其内容如下<template> <div class="wrappe原创 2022-02-10 22:18:14 · 11176 阅读 · 0 评论 -
vue2.5源码分析
源码目录设计:compiler:包含Vue.js所有编译相关的代码。包括把模板解析成ast语法树,ast语法树优化,代码生成。。。core:核心代码。包括内置组件、全局API封装、Vue实例化、观察者、虚拟DOM、工具函数。。platform:Vue.js的入口。两个目录代表两个主要路口,分别打包成运行在web和weex上的Vue.js.server:服务端渲染。代码是跑在服务端渲染的Node.js。把组件渲染为服务端的HTML字符串,直接发送到浏览器。sfc:把.vue文件内容解析成一原创 2020-12-24 13:20:14 · 137 阅读 · 1 评论 -
Axios提交带有文件的表单(ElementUI)
<el-form :model="addForm" ref="addFormRef" label-width="75px"> <el-form-item label="学校" prop="school"> <el-select v-model="addForm.school" placeholder="请选择学校"> <el-option v-for="item in schools" :key...原创 2020-08-27 09:55:23 · 798 阅读 · 0 评论 -
获取本地ip(网卡ip)
1.代码中获得ip首先在data里添加一个ip为空data() { return { ip: '' };}然后在methods里面写上getUserIP(onNewIP) { let MyPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection; ...原创 2020-08-19 10:11:12 · 509 阅读 · 0 评论 -
vue 小马哥笔记3-配置axios插槽vuex
1.vue 文件配置:2.axiosaxios拦截3.slot插槽:有替换元素就替换,没有就插入默认元素4.响应式修改数组 splice set5.原创 2020-10-27 13:37:38 · 214 阅读 · 0 评论 -
vue-cli3设置项目ip
1、创建vue.config.js(cli3相对于cli2,之前的build和config文件夹不见了,那么应该如何配置 如webpack等的配那只需要在项目的根目录下vue.config.js文件(是根目录,不是src目录))module.exports = { devServer: { port: 8080, // 端口号 host: "localhost", https: false, // https:{type:Boolean}原创 2020-07-21 16:13:29 · 1803 阅读 · 0 评论 -
深入样式/deep/
使用vue脚手架和elemen-ui开发的前端项目对div下的el-select下拉组件 设置样式,直接在标签上用style属性是完全可以的,但我们的开发规范是前端样式必须扔到<style>中,因此会遇到 使用el-select按钮组件的时候 页面被渲染出来会有好几层 ,怎么正好把样式加到对应那个下拉那个input元素上呢?--最外层class后面加上/deep/可以对其子组件加上所需样式el-select组件被渲染后的html 会多出来几层 如下:我们如果要对select...原创 2020-07-08 20:09:43 · 951 阅读 · 0 评论 -
vue-cli4 axios跨域问题
module.exports = { configureWebpack: { devServer: { proxy: { //名字可以自定义,用于指定哪些请求需要被 target 对应的主机代理 // 当前 devServer 的地址是 localhost:8080 , 需要代理的地址是 localhost:3000 '/api': { target: 'http://localhost:3000', //设置你调用...原创 2020-07-08 19:30:15 · 424 阅读 · 1 评论 -
vue 小马哥笔记2
p162p163计算属性可以放拿到的数据结果p167Vh:视口高度 设置100vh就是百分百视口p168原创 2020-07-08 21:48:53 · 403 阅读 · 0 评论 -
朝阳二维vue笔记
1.vue项目中关闭eslint的方法:在项目根目录下增加vue.config.js文件。module.exports = { lintOnSave: false }2.重复点击同一路由报错:在router/index.js中添加如下代码constoriginalPush=VueRouter.prototype.pushVueRouter.prototype.push=functionpush(location){returnoriginalPush.call...原创 2020-08-21 16:36:17 · 219 阅读 · 0 评论 -
vue 小码哥笔记
P47P48p69插槽的作用域p74导入导出Webpackp98p101p115p116p124别名P125 126 127P129vuexP131vuexP133 gettersP141 jsonpP143axiosGet 传参用pa...原创 2020-06-27 19:33:55 · 337 阅读 · 0 评论 -
vue+arcgis api开发实例
1.首先和传统的开发一样,需要引入js文件和css文件,但是因为是用vue来开发,所以传统的通过标签的方式来引入的方法不适用了,arcgis官网给我们提供了一个工具"esriLoader",这是他的npm地址esri-loader。(命令:npm install --save esri-loader)2. 在项目中新建一个arcgis的配置文件,名称叫mapConfig.js(这个名字可以自...原创 2020-01-15 10:41:06 · 4269 阅读 · 1 评论 -
vue-cli+webpack安装配置
npm install -g @vue/clivue init webpack 项目名cd projectnpm installnpm run dev原创 2019-11-12 14:03:12 · 139 阅读 · 0 评论 -
vue-demo
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><原创 2019-03-10 22:02:15 · 163 阅读 · 0 评论 -
vue基础
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><原创 2019-03-10 21:27:18 · 185 阅读 · 0 评论 -
Vue Router
一.<!-- 使用 router-link 组件来导航. --> <!-- 通过传入 `to` 属性指定链接. --> <!-- <router-link> 默认会被渲染成一个 `<a>` 标签 --> <router-link to="/foo">Go to Foo</router-link&a原创 2019-03-10 21:25:25 · 226 阅读 · 0 评论 -
Vuex文档笔记
vuex如果在模块化构建系统中,请确保在开头调用了 Vue.use(Vuex):我们通过提交mutation的方式,而非直接改变store.state.count,是因为我们想要更明确地追踪到状态的变化。store中的状态是响应式的。核心概念1.State Vuex的状态存储是响应式的,从store实例中读取状态最简单的方法就是计算属性中返回某个状态;把store对象提供给‘st...原创 2019-03-14 16:51:09 · 525 阅读 · 0 评论