老程的博客

移动端开发兼容性问题记录（H5、vue、vant）: new Date() 、安卓键盘弹起压缩页面高度、sort排序结果不一致……

H5端，手撸生命线 timeline 组件

需求简述：需要一个取色面板，由于element组件里面的事一个取色按钮，点击了才出现悬浮的取色面板，所以需要想想办法效果图 如下：起先思路：想用elementUi里面的取色按钮改造下 或是 js代码点击下按钮然后修样式，都尝试了下，最后还是不可行；百度找了下也没找到类似的，类似的有都是JQ写的，最后上github 找到了一个资源用上了资源地址： vue-color安装依赖："vue-color": "^2.8.1",安装注册插件：拉了他的项目运行看了下，我需要用的是它的 chrome.

无需加载外部资源，动态切换项目主题色（ 使用的 Element UI）

1、网络中使用最多的图片格式有哪些？ jpg和png有什么区别？JPEG,GIF,PNG,最流行的是jpeg格式，可以把文件压缩到最小区别：1、jpg是有损压缩格式，png是无损压缩格式。2、jpg图像没有透明的背景，而png图像可以保留透明的背景。3、png格式的图片可以编辑，但是jpg格式的图片则不可更改。4、png与jpg图片相比，png格式的图片更大。2、简述css盒子模型一个css盒子从外到内可以分成四个部分：margin（外边距），border（边框），padding（内边距），

记录一些 关于vue2 -> vue3 杂七杂八的坑最大的两个问题 ：① element-ui 换了,vue3 用的是 element-plus②devtools 换了，vue3要安装另一版本的插件 chrome商店 、 github左边 vue3项目用 右边 vue2 项目用其他 很多变化 需要看官网v-lazy 资源包 换成 vue3-lazy.sync 语法换成 v-model 参考官方vscode 报错 ‘v-model’ directives require no

vscode 配置 用户代码片段入口如下分享两个我配置的1、vue 文件代码初始化，有些已经注释了，可以自行调整{ // Place your snippets for Vue here. Each snippet is defined under a snippet name and has a prefix, body and // description. The prefix is what is used to trigger the snippet and the body

组件效果图 --------> 手动输入vue代码如下<!-- --><template> <el-dialog title="发放优惠券" :visible.sync="isShow" class="send-coupon" width="30%" top="20vh" @update:visible="(val) => $emit('update:visible', val)" :clos

1、canvas动画说明10种动画每种都可以拆分为前后两部分； 前部分为第一张做动作（缩放、左右上下移动）, 后一部分为第二张图片进场，进场方式多种根据特效而定；各动画的具体实现参考各动画的代码用到的主要api : 切片 drawImage(image, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight)img规定要使用的图像、画布或视频。sx可选。开始剪切的 x 坐标位置。sy可选。开始剪切的 y 坐标位置。sw

manifest.json{ "name": "Vue.js devtools", "version": "4.1.5", "version_name": "4.1.5", "description": "Chrome and Firefox DevTools extension for debugging Vue.js applications.", "manifest_version": 2, "icons": { "16": "icons/16.png", "

1、后台返回的二进制字节流 byte[ ]{responseType:'arraybuffer} 设置好后端接收返回的格式，一般还有json,buffer,blobaxios.post('url',params,{responseType:'arraybuffer}).then(res=>{ // 开始处理文件下载 - res.data为文件流 let src= window.URL.createObjectURL(new Blob([res.data], { // 后

需求说明：需要查订单的各个状态：正常、处理中、异常…… ； 如果处理中的数量不为0 ，则一直轮询发请求查，直到处理中数量为0再停止；另外切换页面了就不查了；代码如下：这是我要的数据对象 processingCount 不为0 就一直请求getOrderStatusTotal: { errorCount: null, //异常总 successCount: null, //处理成功总 processingCount: null, //处理中总 //….

需求：点击 ‘编辑’ 图标备注文本信息变成输入框可编辑，编辑后焦点离开发请求到后台修改数据；效果图：开始状态点击后修改以及修改后：//编辑备注 editByFont(id, index) { var oldhtml = document.getElementsByClassName('font-editByFont')[index] .innerHTML //如果已经双击过，内容已经存在input，不做任何操作 if (old.

需求描述：首先需求表格遍历显示数据，每行前需要一个复选框；要求二是根据每个对象的某个属性值判断是否默认被选中，如下图，是可关联商品的默认被选中表格前面加复选按钮可以直接参考el官方组件第一步： 在 el-table 中加ref 属性，它在vue中相当于是id的存在。 ref=“multipleTable”,下面写 js 用的<!--vue--><el-table :data="tableData" ref="multipleTable" .

需求简介：项目是 vue 项目，需要用到一个全局变量，其他组件都可读取和更新它；使用的 Vuex 解决；首先 store 文件夹 index.js 通过vuex 五大属性设置好 全局对象或变量<!-- store-index.js -->import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)export default new Vuex.Store({ state: { user: {}, ab.

问题描述， 使用 el-dialog 对话框是有个取消按钮，想实现取消按钮和关闭按钮一样的效果；结果关闭之后父组件拿就再打不开了；原因是 emit 和 sync 语法没掌握；//子组件<el-dialog title="充值" :visible.sync="isShow" width="30%" :destroy-on-close="isclose" @update:visible="val => $emit.

需求描述：我需要根据父组件传来的一个变量，根据变量值的不同然后给子组件某元素添加不同的样式1、起初思路通过监听父组件传过来的变量值发生变化然后，根据值使用 js 的语法直接拿到给页面元素添加不同的class样式；页面元素：<div class="el-carousel-Banner" :visible="isShow" @update:visible="val => $emit('update:visible', val)"></div>js:pro.

需求：弄一个文件上传的子组件，我需要上传的文件时音乐MP3文件，上传时需要做文件类型、大小、时长做出限制，其中时长限制存在异步问题，后来是通过watch监听间接实现的；看 官方文档 el-upload 组件的 before-upload 属性可以做文件格式校检；官方对该属性的说明是：上传文件之前的钩子，参数为上传的文件，若返回 false 或者返回 Promise 且被 reject，则停止上传；组件代码如下：<template> <el-dialog .

说明：全文无逻辑顺序和关联，开发中遇到知识盲点就来记一下1、数据遍历时拿数据<template slot-scope="scope"> <el-button type="danger" @click="closeActivity(scope.row.id, scope.$index)"> 结束活动 </el-button></template>// s.

问题描述： 需要根据传来的不同参数（子组件的名字）加载不同的子组件显示<component :is="nowPopupType" :content="content" :visible.sync= "isshowPopover" ></component>nowPopupType 为子组件名字变量；isshowPopover 为子组件是否显示的变量content 为传给子组件的变量参数...

1、下载 nvmGithub下载地址：nvm-windows2、安装路径自己选，环境变量他会自己添加的不用管，一步步点就可以了cmd检查安装师傅成功：C:\User\admin> nvm -vversion 1.1.7查看已安装的nodejs版本C:\User\admin> nvm list * 6.10.2 (Currently using 64-bit executable)查看可安装的nodejs版本nvm list available| CURRE

html<el-upload accept=".mp3" class="upload-demo" drag action="str" :http-request="handlerChange" :auto-upload="true" :before-remove="true" multiple> <i class="el-icon-upload"></i> <div class="e

能获取到数据数据却渲染不到页面上问题描述： 我数据全部拿到了，js 里面写 console.log( musics ) 数据打印出来都正确，但是页面里面就是不显示。页面代码如下：<template> <ul> <li v-for="(item,index) in musics" :key="index" > <div class="title">{{item.musicTitle}}</div>

1、props : 父组件 向 子组件 传参Parent.vue**<template><div> parent：下面是我的子组件 <childSon :userName='name'></childSon></div></template><script>import childSon from './Childs'export default { name:'Parent',