vue
关注
分享
扫一扫
前端抠脚
要多菜有多菜的菜鸡
展开
-
vue-cli 环境变量 process.env的使用
话不多说直接看代码在package中的配置如下图举个本地运行的例子.env.serve；注意：除了VUE_APP_*变量之外，在你的应用代码中始终可用的还有两个特殊的变量： NODE_ENV- 会是"development"、"production"或"test"中的一个。具体的值取决于应用运行的模式。 BASE_URL- 会和vue.co...原创 2020-04-20 12:20:05 · 8895 阅读 · 1 评论 -
js setInterval 实现倒计时
<script>export default{ data() { return{ count:0 } }, methods:{ getcode() { //倒计时 const TIME_COUNT = 59; ...原创 2020-04-02 10:15:19 · 279 阅读 · 0 评论 -
vue api 封装 登录验证 状态提示 页面动画
下面是我在项目中api接口封装和状态码提示http.js:import axios from 'axios';import QS from 'qs';import {isJson} from "./common.js";import store from '../../store/'import { Dialog } from 'cube-ui';import router f...原创 2020-04-02 10:04:25 · 547 阅读 · 0 评论 -
vue bus 用法
公共bus.js//bus.jsimport Vue from 'vue'export default new Vue()组件A<template> <div> A组件: <span>{{elementValue}}</span> <input type="button" value="点击触发" @click...原创 2020-04-01 18:01:53 · 310 阅读 · 0 评论 -
vue router history nginx 相关配置
服务器配置 location ^~ /h5/usr { alias /usr/local/project/cpn/i84cpn-web-0.1/h5/usr; try_files $uri $uri/ /h5/usr/index.html; }前端配置router.js路由配置production 与location路径一致const ...原创 2020-04-01 15:16:05 · 196 阅读 · 0 评论 -
H5安卓软键盘弹出把底部内容顶上去处理
H5安卓软键盘弹出把底部内容顶上去处理解决方案就是，监听窗口变化，如果窗口变小就将 body html 高度变大使得内容能够全部展示出来，在窗口变回原来大小的时候body,html高度应该要还原，直接上代码如下<template> <div class="dedicatedLine-box" refs="dedicatedLine"> <div ...原创 2020-03-18 11:30:08 · 1280 阅读 · 0 评论 -
js 通过正则过滤 emoji 表情
<input type="text" v-model.trim="names" @input="emojistr"> emojistr(){ let _this = this; //可以过滤绝大部分emoji表情但是还是有小部分过滤不了 this.names = unescape(escape(_this.names).repl...原创 2020-03-17 15:06:26 · 2954 阅读 · 0 评论 -
vue nextTick的用途和用法
用途nextTick应用场景：需要在视图更新之后，基于新的视图进行操作。详情参考这里简单来说，Vue 在修改数据后，视图不会立刻更新，而是等同一事件循环中的所有数据变化完成之后，再统一进行视图更新。/改变数据vm.message = 'changed'//想要立即使用更新后的DOM。这样不行，因为设置message后DOM还没有更新console.log(vm.$el.t...翻译 2020-02-20 15:08:38 · 316 阅读 · 0 评论 -
@import "../style/lines.scss" 导致background: url（）路径无效问题
@import "../style/lines.scss" 导致background: url（）路径无效问题解决方案是在webpack中的vue.config.js中配置configureWebpack: config => { let obj = {}; obj.resolve = { alias: { 'img': '@/ass...原创 2019-03-12 10:24:46 · 2388 阅读 · 0 评论 -
postcss cube-ui 单位问题
在移动端单位有时候我们用vw ，cube-ui默认会安装postcss-px-to-viewport 默认设置是如下 'postcss-px-to-viewport':{ viewportWidth: 375, viewportHeight: 667 , unitPrecision: 5, viewportUnit: 'vw', ...原创 2019-03-12 10:06:02 · 1015 阅读 · 0 评论 -
axios 封装
下面是对axios 封装，不喜勿喷，谢谢import axios from "axios";import qs from 'qs';import store from "../../store"axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8'; a...原创 2018-11-27 17:57:24 · 404 阅读 · 0 评论 -
vue key的用法
在项目过程中继续扫码然后跳转地址不变参数值发生变化，此时页面不会刷新的，比如地址是https://www.liu.com/h5/online/index.html/#/encyclopedias?cycId=90然后继续扫码变成https://www.liu.com/h5/online/index.html/#/encyclopedias?cycId=91解决方法：给路由的router-vi...原创 2018-11-27 17:40:41 · 1231 阅读 · 0 评论 -
vue 音频播放 audio
componet 组件<template> <div class="di main-wrap" > <!-- 这里设置了ref属性后，在vue组件中，就可以用this.$refs.audio来访问该dom元素 --> <audio ref="audio" class="dn" :src="ur转载 2018-11-27 17:23:00 · 23456 阅读 · 2 评论 -
H5视频播放 vue-video-player
<template> <div class="video-page"> <div class="header-box"> <div class="headers"> <van-nav-bar @click-left="onClickLe原创 2018-11-27 17:07:05 · 3469 阅读 · 1 评论 -
ifame 嵌套微信公众号文章和 ios内容变大兼容处理
html&lt;div class="iframe-box"&gt; &lt;iframe id="iframes" src="" frameborder="0"&gt;&lt;/iframe&gt; &lt;/div原创 2018-11-27 16:45:59 · 388 阅读 · 0 评论 -
vue 拍照上传
vue 拍照上传 涉及技术点 canvas裁剪 base64 blob数据装换 forData 数据传递 ，还有hammer.js和exif-js具体代码如下&lt;template&gt; &lt;div class="pic"&gt; &lt;div class="bg-box"&gt;原创 2018-11-27 11:49:07 · 2268 阅读 · 0 评论 -
滚动监听fixed header颜色切换
html&amp;lt;template&amp;gt; &amp;lt;div ref=&quot;viewBox&quot; class=&quot;abc&quot;&amp;gt; &amp;lt;div :class=&quot;{fixed:true,bg:isColor}&quot;&am原创 2018-11-27 11:17:37 · 1008 阅读 · 0 评论