happy921212的博客

我目前项目基于element-ui+vue+i18n+router架构的平台，我会每天总结一点遇到的坑和解决方案，以备后续查阅解决。就如标题所示：在router.js里用elmentUI组件和i18n的翻译。如果我们们集成的vue-router,在router文件夹里的index.js中是用不了this.$t('xxxxx')这样的翻译和this.$confirm()这样的组件的。那怎...

element-ui的菜单样式重构，需要了解结构，再做定制……

最近，用着vue2.0想要体验vue3.0，原来使用webpack，现在也向体验一下vite怎么个轻量，速度，然后就有了踩坑之旅……

1.webpack.base.conf.js里 externals:{ 'vue-fabric-canvas':'fabricCanvas' },output: {……2.main.js里引入dist生成的js插件const fabricCanvas = require('../static/js/fabric/vue-fabric-canvas.min');Vue.use(fabricCanvas.FabricCanvas);3.index.html中引入插件css:

近期更新一波开箱急用，拿来主义的demo。比如我需要子组件弹框的时候就会如下初始化：<template> <el-dialog :closeOnClickModal="$store.state.isFALSE" title="选择内容" :visible.sync="selectcontents" center :before-close="handlecontentClose" width="1000px"> <!--弹框内容-->

当el-select数据超过1000条，页面就会出现明显卡顿。此时的优化方案除了后台接口分页，前台也可以自行数据分页：<el-select filterable v-model.trim="formInline.storeId" :placeholder="$t('SearchNameAll.PleaseChoose')" @change="getfilelist(1)" v-el-select-loadmore="loadmore"> <el-option v-fo

很多时候需要数据，我们需要自己造：exampleData (){ let data = new Array(10).fill().map((v,i)=>{ return { id: (this.id+i), name:'数据' + (this.id + i), } }); return data;} 下次需要可以直接用了...

今日分享时间戳格式化的方法：//格式化日期时间 保留两位数ismm(m){return m<10?'0'+m:m },//时间格式化timeFormatting(now){ var time = new Date(now); var y = time.getFullYear(); var m = time.getMonth()+1; var d = time.getDate(); var h = time.getHours(); var mm

今日分享文件大小格式化的常用方法：//大小格式化sizeFormatting(now){ if(now===0||now===null||now==""){ return now } var unitArr = new Array("B","KB","MB","GB","TB","PB","EB","ZB","YB"); var index=0, srcsize = parseFloat(now); index=Math.flo

最近在用element-ui遇到一些bug,在使用el-select时，数据量大了就页面渲染缓慢从而

今天分享一下elment-ui+vue+axios架构中的拖拽上传功能，因为需求中需要拖拽的效果，就没有用ement-ui中的el-upload组件。并且这个效果只在有文件从window的文件夹里拖拽到这个页面才会显示提示，仿网盘那种效果，可以批量拖拽上传。右上角还可以点击选择文件，并且可以看到上传进度和终止上传。1.首先，做的是这个悬浮的虚框，用到相对漂浮的position:absolute;没有用element-ui中的上传组件，因为不好排版，那个默认蓝框框和点击上传的附加功能这边是不需

element-ui制作文件夹命名仿window效果提示，即当输入特殊字符“？”、“、”、“/”、“╲”、“*”、“<”、“>”、“|”等，禁止输入，并且弹出气泡提示。效果如上图，当命名文件夹时，提示，并且输入框不能录入特殊字符。<el-tooltip content="文件名中不能有下列符号：“？”、“、”、“/”、“╲”、“*”、“<”、“>”、“|”。" placement="bottom" effect="light" :hide

今天做一个取URL参数的例子：1.如果是xxx/#/index?tab=alet cur = this.$route.query.tab;页面传参如下： <template> <router-link :to="'/index?tab=' + item.id"> <div @click="$router.push( '/index?tab=a');"> 点我跳转</div> </template>2.

vue单页面应用时会有一些性能优化的需求，此时方向在此总结，会持续增加：1. 浏览器缓存有些重复的数据可以存入浏览器缓存作为前端小数据库使用；2. 防抖、节流3. 资源懒加载、预加载效果上会友好很多4.开启Nginx gzip压缩前端性能优化方向：一： webapck优化与开启gzip压缩1.babel-loader用 include 或 exclude 来帮我们避免不必要的转译，不转译node_moudules中的js文件 其次在缓存当前转译的js文件，设置loa.