- 博客(22)
- 收藏
- 关注
原创 img标签关于填充方式的属性
img属性object-fit属性值:object-fit: fill / contain / cover / none / scale-down;fill: 默认值。内容拉伸填满整个content box, 不保证保持原有的比例。contain: 保持原有尺寸比例。长度和高度中短的那条边跟容器大小一致,长的那条等比缩放,可能会有留白。cover: 保持原有尺寸比例。宽度和高度中长的那条边跟容器大小一致,短的那条等比缩放。可能会有部分区域不可见。none: 保持原有尺寸比例。同时保
2022-02-15 15:22:30
10399
原创 创建uni-app 微信小程序项目
1.创建项目:npm create -p dcloudio/uni-preset-vue 项目名2.启动项目(微信小程序):npm run dev:mp-weixin3.微信小程序开发者工具导入项目:目录:项目名/dist/dev/mp-weixin4.安装sass-loader和node-sass(注意版本问题,不能安装最新版本):卸载之前版本:npm uninstall sass-loadernpm uninstall node-sass -D安装sass-loader@7.3.1和
2021-10-29 09:58:10
595
原创 组件间的数据传递、组件插槽slot的使用
首先区分下父子组件父组件: 引入组件的组件为父组件(简单理解:组件内容多。)。子组件: 被引入的组件为子组件。父组件向子组件传递组件:父组件在标签动态绑定一个属性,如:<my-son :fathermsg='来自父组件的呐喊' ref="sonref"></my-son>子组件用props接收,如:props: { 'fathermsg':String, }扩展: 通过方法传递数据 父组件:this.$refs.sonref.子组件对应的方
2021-10-22 14:46:03
177
原创 关于对tree树形结构的递归遍历感悟!
1.首先贴下树结构的递归遍历代码如下2.对于树形结构的格式是由后端同学提供还是前端同学组织的感悟!3.如何根据业务需求对树形结构数据再加工的关键!———-待整理后续更新。 周末快乐!!———...
2021-06-04 23:07:42
161
原创 H5的适配
<script type = "text/javascript"> //rem适配优化 //rem适配原理:改变了一个元素再不用色呗上占据的css像素的个数。 (function(){ var styleNode = document.createElement("style"); var w = document.documentElement.clientWidth/16; styleNode.innerHTML = "html{font-size:"+w+"px!impo
2021-03-05 10:34:10
210
1
原创 采用vue+keepAlive对h5的菜单栏进行定位;实现进入详情页返回时,回到离开菜单栏的位置并刷新。
本篇文章主要处理:h5中在菜单点击菜品,进入菜品详情,返回后回到原来的菜单位置第一步:在vue项目的根组件也就是App.vue添加keepAlive标签。主要代码如下:<template> <div id="app" > <keep-alive> //缓存组件的跳转 需要在路由添加keepAlive为true <router-view v-wechat-title="$route.meta.title" v-if="$route
2020-08-14 11:45:12
722
原创 整合websocket和vuex以及websocket的心跳机制,实现项目只创建一次长连接
一、需求a职员操作订单详情时需要同步刷新职员b所在同一订单页面 触发:开台、分配餐桌、加菜、修改餐具数量、上菜、赠菜(取消)、退菜(取消)、预结、计算、翻台、转台时,需要对订单及时刷新;同时也刷新其他人员停留在当前订单的页面。二、思考前端长链接需处理要点:限制创建长链接数量限制通知过来是否进行刷新(只刷新页面在当前订单的)防止长链接断开三、旧处理方法方法1:在需要刷新的页面直接创建websocket;在离开页面前没有进行销毁websocket;(弊端:当再次进入页面时,又重新创建一
2020-07-23 09:27:15
2045
1
原创 学习笔记之CSS
css菜鸟教程学习笔记1.ID选择器的属性不要以数字开头,类名选择器的属性同样也不能以数字开头2.内部样式优先级高于外部优先级,内联样式(样式在标签style属性里)优先级高于内部优先级3.设置背景图只在水平方向平铺(repeat-x),style = “background-repeat:repeat-x”4.链接状态;link-正常,未访问链接;visited-用户已访问过的链接;ho...
2020-03-17 09:03:52
254
原创 通过math.js解决科学计数法保留两位小数的问题。
通过math.js解决科学计数法保留两位小数的问题。问题:整数超过6位数的数值为字符串类型时会自动转换为科学计数法,采用字符串截取两位小数出错。例如:2.44533610979e+5截取完理想值为:2.44533e+5;实际结果为:2.44。思路:先把大数值转换为Number类型,再采用字符串截取两位小数,报错。不可取!!先把大数值转换为Number类型,再采用Math.floor截取...
2020-02-26 13:45:21
7028
原创 数据对象改变视图不会跟着改变。巧用this.$set()进行改变
用法1(对象)this.$set(“将要改变的对象”,"将要改变的对象的属性”,“改变后的值”)用法2(数组)this.$set(“将要改变的数组”,“将要改变的下标”,“改变后对应下标的值”)...
2020-01-14 17:15:31
263
原创 在Vue项目中安装配置Math.js的方法解决计算bug问题
1、 安装输入命令npm install mathjs 进行安装;出现 如下图所示则证明安装成功。2、配置math.js const { create, all } = require('mathjs') const config = { number:’BigNumber’, precision:20 } const math = create(all,config)注...
2020-01-03 17:17:11
3141
原创 css样式 h5页面内容过长自动换行和多余用省略号...表示
问题:当内容为中文时会自动换行,单内容是数字或字母组成不会自动换行方案如下:.***{ word-wrap: break-word;}
2020-01-02 10:59:59
2670
原创 vue element 删除不了刚上传的照片墙。
问题描述:在照片墙进行添加照片abc,接着删除照片c,再上传照片d。最后显示的是照片abcd。如下动图图所示:当点击编辑进行修改时:目前有照片abcd,再上传照片ef,接着删除照片abcde,最后照片墙显示ef两张照片。解决思路: 删除刚上传的图片和删除进入编辑页面就已经上传的照片地址是不一样的。通过debug发现如下//当删除进入编辑页面就已上传的照片返回的file为:{uid: 1...
2019-12-28 09:50:37
899
原创 VScode必须安装的插件
VScode必须安装的插件注意:koroFileHeader安装版本2.9.0。不要安装最新版本。settings.json文件的代码如下:{ "svn.enableProposedApi": "product", "window.zoomLevel": -1, // "git.autoRepositoryDetection": false, // "git...
2019-12-07 09:48:53
825
原创 学习笔记之JavaScript
学习笔记之JS1. 数组转换成json格式2.1. 数组转换成json格式list= ['zhangsan','lisi','wangwu']//转换前newList = [{student:'zhangsan'},{student:'lisi'},{student:'wangwu'}]//转换后//jsfor(i = 0; i<list.length;i++){ obj = {...
2019-11-30 15:41:42
161
原创 vue element 右上角×关闭弹窗并清空表单校验信息
vue element UI el-dialog 如何监听右上角 x 关闭按钮并清空表单校验信息先上图需求:点击取消按钮和右上角的的×都要清空form表单的信息。首先:点击取消按钮清空按钮的实现方法比较简单,不多说贴代码:模板中代码:<el-button @click="close('form')">取 消</el-button>js代码: close(...
2019-11-20 14:27:14
7651
2
原创 vue开发规范,看这篇就完事了!!
vue开发规范。(个人整理,不足请指教)一、目录结构二、UI框架选择三、文件夹、组件命名规范、组件结构规范四、组件样式五、 文件格式六、 Template模板文件七、 Script八、 Style九、注释规范十、路由一、目录结构|— build 构建脚本目录 |— build.js 生产环境构建(编译打包)脚本 |— check-versions.js 版本验证工具 ...
2019-11-02 16:53:29
1303
原创 Vue生命周期函数图文详解
Vue生命周期函数图文详解一、看图时请先搞定什么是内存、什么是页面上内容、什么是数据???以及他们的区别。①内存:②页面上内容:③数据:二、在html上打印方法①内存:②页面上内容:console.log(document.getElementById(页面上内容));③数据:console.log(数据);三、图文详解如下(带星星为常用的生命周期函数):初入职场,望各位大......
2019-09-19 18:05:26
163
原创 vue样式叠层z-index不起作用问题
vue element样式叠层问题问题:当点击出现element弹框时,与当前的页面出现叠层问题,导致弹框页面无法输入。问题效果图如下:这里的两个下拉框和echarts图表与弹框修改密码出现叠层问题。解决思路:本人一开始在层级上寻在了半天,未能解决问题,后来发现是上个开发兄弟在两个下拉框和echarts图表均使用到了样式 position: absolute;导致无法实现。实现方...
2019-09-10 09:59:39
2685
原创 vue element计算表格合计问题
vue element计算表格合计问题问题:当表格的el-table-column标签下的属性prop属性值为‘对象.属性’时,将不能自动合计。例如: <el-table border v-loading="loading2" element-loading-text="拼命加载中" ele...
2019-08-15 11:42:34
7094
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人