- 博客(18)
- 收藏
- 关注
原创 非vuecli3 项目配置测试与正式环境
参考链接:https://blog.youkuaiyun.com/qq_39696861/article/details/81502464自我实现1.修改package.json"build:test": "cross-env env_config=test node build/build.js"2. 安装cross-envnpm i --save-dev cross-env3.在project\config\prod.env.js中配置不同的设置module.exports = { NOD
2020-10-19 14:29:56
162
原创 利用vuex缓存常用数据,通过getter获取state中的数据和发送请求
代码使用import { mapGetters } from 'vuex' computed: { ...mapGetters([ 'professionList', // 从getter.js中获取下拉选择框的缓存, 可以减少请求 ]), },getter.jsimport store from './index.js'const getters = { professionList: (state) => { if (!s
2020-09-11 14:37:24
1918
原创 水平垂直居中 两三行代码搞定
<div class="parent"> <div class="child"></div></div>div.parent { display: flex; justify-content: center; align-items: center;}div.parent{ display:flex;}div.child{ margin:auto;}div.parent { p
2020-09-11 09:43:32
157
原创 获取视频的首帧图片、本地预览视频(首帧图片有时候为透明)
本地视频预览组件<template> <div class="upload-area"> <div class="upload-card"> <div class="image" @click="previewVideo"> <input @change="upload" @click.stop type="file" accept="video/*" class="upload-file" ref="uploa
2020-09-11 09:38:47
1255
原创 防抖、节流函数
参考文章: https://www.cnblogs.com/cc-freiheit/p/10827372.html防抖短时间内多次触发同一事件,只执行最后一次,或者只执行最开始的一次,中间的不执行。分为立即执行和非立即执行;非立即执行;非立即执行版的意思是触发事件后函数不会立即执行,而是在 n 秒后执行,如果在 n 秒内又触发了事件,则会重新计算函数执行时间。function debounce(func, wait) { let timer; return functio
2020-09-02 16:15:47
200
原创 用一个类实现 on、emit、以及off
参考连接: https://www.cnblogs.com/saysmy/p/10867485.html代码 class observes { constructor() { this.obj = {}; this.on = function (name, fn) { if(!this.obj[name]){ this.obj[name] = [];
2020-08-20 11:25:49
269
原创 利用base64下载文件,以及它因文件过大无法下载的问题
接口返回结果如此代码exportByBase64(response) { // const bloburl = dataURIToBlob(response.file) var downloadElement = document.createElement("a"); // downloadElement.href = URL.createObjectURL(bloburl); downloadElement.href = response.fil
2020-08-19 14:51:06
2873
原创 axios上传file文件需要传二进制引发发的 axios传参json、transformRequest、newformData的区别分析
正常情况上传文件应该new 一个 formData, 是一个binary,二进制let params = new FormData();params.append('file', this.file); const url = this.$http.adornUrl('uploadurl', 'proxyUpload') this.$http({ url, method: 'post', data: params, })如果params不用formData,上传的file是
2020-08-18 15:52:04
2886
原创 递归组件
思路组件在它的模板内可以递归地调用自己,只有当它有 name 选项时才可以。 在官网这句话就是关键定义组件是一定要有name属性。效果代码父组件<template> <div> <el-menu style="width: 200px"> <diguiComponet v-for="(model, index) in diguidata" :model="model" :key="index"/> &
2020-08-05 15:08:53
196
原创 vue slot-scope 的使用
1、简单版//组件 <template> <div class="title-card"> <div class="header"> {{title}} </div> <div class="content"> <slot></slot> </div> </div> </template><script>
2020-07-23 10:12:34
210
原创 video 切片上传探索
参考文章:1.https://blog.youkuaiyun.com/zrcj0706/article/details/103137617(写的挺好的、就是有几个外部引入的方法没有写全)2、这个有点吊,就是代码不够好看,切片上传和断点续传都写好了3.这个有戏,听他自己说挺成熟的,感觉有点giao...
2020-06-16 09:39:58
295
原创 一个默认focus的input组件vue
<template> <!-- v-html="innerText" --> <input class="edit-div hover_focus" ref="input" v-model="innerText" contenteditable="true" @blur="shuchu" @change="changeText"/></template
2020-05-26 11:13:11
459
原创 vue项目动态router的实现
将router分为两类创建不受远程控制的路由export const constantRoutes = [ { path: '/404', name: '404', component: () => import ('@/views/404'), ...
2020-04-29 11:57:58
722
原创 js流文件创建a标签下载的方法
啥也不说 上代码export function downLoadFile(vm, url, params, name) { vm.$http({ url: url, method: "post", data: params, headers:{'filename':'utf-8'}, // 这儿可能需要更改 responseType: 'arrayb...
2020-04-29 11:28:26
812
原创 vant ui 为例配置rem + viewport的移动端项目
vant ui 为例配置rem + viewport的移动端项目Rem 适配Vant 中的样式默认使用px作为单位,如果需要使用rem单位,推荐使用以下两个工具:postcss-pxtorem 是一款 postcss 插件,用于将单位转化为 remlib-flexible 用于设置 rem 基准值vue3.0中使用postcss-pxtorem - 简书直接新建或者在已有的post...
2020-04-29 11:21:24
623
原创 创建一个宽高等比例的容器
html<div class="parent"> sdadas <div class="child"></div> </div>cssparent和after生成一个等比例的容器child和里面的内容均不会撑开parent的宽度和高度.parent{ width: 200px; ba...
2020-04-29 11:11:08
196
原创 怎么做一个页面合格项定位功能
dom的渲染<div v-for="(item, index) in List" class="item" :key="index></div>合理对象的筛选const machIndex = [];this.List.forEach(item, index => { if (item.value) { machIndex.push() }...
2020-03-18 16:34:38
136
原创 使用$route制作面包屑
使用$route制作面包屑1. 在router中加上meta属性{ path: '/thematicDiscussion', name: 'thematicDiscussion', redirect: '/thematicDiscussion/home', component: layout, // component: thematicDiscuss...
2020-03-17 20:22:05
664
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人