![](https://img-blog.csdnimg.cn/20201014180756930.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
鱼鱼的铁憨憨
这个作者很懒,什么都没留下…
展开
-
vue-cli中使用postcss-px-to-viewport 将px转换成vw
移动端适配方案中,可以使用vw作为页面中各元素的单位,以此来完成适配效果。下面我们来讲怎样在vue-cli 项目中使用 postcss-px-to-viewport插件。前言先来认识一下postcss,postcss是一个用 JavaScript 工具和插件转换 CSS 代码的工具。postcss的作用:兼容各个内核的浏览器,增强代码的可读性。autoprefixer 插件可以自动获取浏览器的流行度和能够支持的属性,并根据这些数据自动为 CSS 规则添加前缀。 解析浏览器不兼容的css新语转载 2020-10-13 09:57:47 · 1044 阅读 · 0 评论 -
vue-cli3.0引入px2rem与lib-flexible 移动端适配
lib-flexible作用:让网页根据设备dpr和宽度,利用viewport和html根元素的font-size配合rem来适配不同尺寸的移动端设备安装:yarn add lib-flexible引入:入口文件main.js中:import 'lib-flexible/flexible.js'pxtorem作用:将项目中css的px转成rem单位,免去计算烦恼安装:yarn add postcss-pxtorem配置:package.json内,在postcss内添加: "po转载 2020-10-12 17:27:02 · 159 阅读 · 0 评论 -
vue路由跳转 this.$router.go()
1.返回上一页<button @click="goback">返回上页</button>methods:{ goback(){ this.$router.go(-1) }}2.返回到指定页<button @click="goToLink">返回page1</button>methods:{ goToLink(){ this.$router.push('/page1')}或这样写this.$route原创 2020-07-03 15:37:29 · 1200 阅读 · 0 评论 -
想在vue main.js里面用this.$message(‘消息‘)
想在vue main.js里面用elementUI的this.$message('消息');改成Vue.$message('发出');也不执行,该怎么写:import Vue from 'vue';import { Message } from 'element-ui'; Vue.prototype.$message = Message;原创 2020-07-02 17:46:43 · 5693 阅读 · 1 评论 -
键盘控制vue-video-player实现快进退,音量加减
在包裹video的div中添加:v-on:keyup="keyup($event)实现方法:keyup(key) { var vol = 0.1; //1代表100%音量,每次增减0.1 var time = 10; //单位秒,每次增减10秒 // 按向上键 if (key.keyCode == 38){ this.player..原创 2020-05-27 11:26:16 · 3324 阅读 · 1 评论 -
使用vue-video-player点击进度条失效
产生原因:请求服务器端的视频,响应头中缺少如下部分:解决方案:在nginx中添加配置:{index index.html}原创 2020-05-26 16:29:57 · 5142 阅读 · 2 评论 -
视频播放插件(vue-video-player)
1. 安装依赖 npm install vue-video-player -S2. 引入配置// 全局引用import VueVideoPlayer from 'vue-video-player'import 'video.js/dist/video-js.css'Vue.use(VideoPlayer)3. html部分<div class='video'> <video-player class="video-player vjs-cu原创 2020-05-14 20:44:09 · 924 阅读 · 1 评论