- 博客(18)
- 收藏
- 关注
RSS订阅
原创 vue+element-ui 自定义列表头部提示信息
方法一：使用solt插槽<el-table-column align="center" prop="state"> <template slot="header"> <el-popover placement="top-start" title="状态统计" // 表示提示信息头部内容 width="200" tri
2021-09-28 14:59:36
432
原创 element-ui 消息提示框样式修改
请求成功的消息提示框，修改字体大小和其他样式，也可以修改icon的样式/*alert 成功弹出框样式*/.el-message .el-icon-success { font-size: 18px;}.el-message--success .el-message__content { font-size: 18px; font-weight: 700;}调整页面停留时间this.$message.success({message: "工位修改成功", durati..
2020-06-09 17:25:16
4631
原创 vue+element 中表单验证，输入框、选择器及表格验证，自定义验证方法
对form表单中必填项进行验证，自定义验证规则<el-form status-icon :model="popRuleForm" :rules="rules" ref="popRuleForm"> <el-form-item label="供应商：" :label-width="formLabelWidth" prop="name"> <el-input v-model="popRuleForm.name" autocomplete="
2020-05-20 18:06:02
4277
原创 如何去掉element-ui中，tabs中el-tab-pane切换时的下划线
类似这里的下划线，由于设置了背景颜色切换时有差异不好看，就想办法去掉了。找到 .el-tabs__active-bar属性然后覆盖掉就行了/*tabs 去掉el-tab-pane切换时的蓝色下划线*/.el-tabs__active-bar { background-color: transparent !important;}这个是使用element-ui框架的属性，如果是其他框架应该也可以找到相应属性然后进行覆盖。第一篇记录文，继续加油！！never give up！！...
2020-05-09 14:42:27
12528
3
原创 快应用开发--- input 输入框踩坑
快应用中input组件使用maxlength 属性限制长度，一定要设置value属性。否则maxlength属性不会生效！！
2022-07-04 17:37:30
221
原创 VUE 控制el-tabs标签页切换后滚动条回到顶部
使用场景：标签页中内容较多时，滚动条滑到底部，切换tab后，滚动条还是在底部；预期：切换tab后滚动条能回到顶部代码实现：el-tabs 绑定点击事件 tabChange<el-tabs class="tabs" v-model="activeName" @tab-click="tabChange"> <el-tab-pane label="交互规范" name="first"> <ui-main></ui-m
2022-05-17 14:42:59
2834
原创 vue 页面滚动条和div滚动条联动（控制div滚动条位置）
使用场景：页面中存在侧边导航栏，导航栏部分内容无法完全显示，当滚动页面时，div中滚动条一起滚动到导航选中位置主要代码：nav-menu为div的id // 选中当前导航时div自动滚动到设定位置 if (navIndex == "13") { document.getElementById("nav-menu").scrollTop = 0; } if (navIndex == "16") { documen
2022-05-17 14:40:10
2399
转载 超详细Vue实现导航栏绑定内容锚点+滚动动画+vue-router(hash模式可用，不会改变url地址)
首先是一些说明动画效果是原生 js 实现，不可能为了这么一个动画引用 Jquery 这么大一个库 因为是在 vue-router 的 hash 模式下，所以就不能用herf="#contentx"这样的方式来跳转了，这里用 js 来滚动到指定元素位置文章整体思路是先布局，然后把内容和导航联动起来，最后来实现点击导航滚动到指定内容布局话不多说，上代码navs.vue<template> <div> <!-- 内容区域 --> &
2022-04-25 14:44:44
2119
原创 解决node-sass 安装失败
npm install -g cnpm --registry=https://registry.npm.taobao.org
2021-09-16 17:58:51
257
原创 快应用开发之子组件监听父组件传值的变化
父组件将需要被监听的值发布出去this.$broadcast('themeMode', this.themeMode)子组件监听值 data() { return { changeStatus: '', } },onInit() { this.$on('themeMode', this.changeThemeMode) }, changeThemeMode(evt) { this.changeStatus = evt.detail
2021-09-07 11:13:38
171
原创 快应用开发之父子组件间调用函数
子组件调用父组件函数：/* 父组件 */// 组件引入<import name="network-error" src="../Common/components/com-network-error.ux"></import>// 方法绑定 getProducts为父组件方法<network-error if="{{networkStatus}}" @fatherMethod="getProducts" ></net
2021-09-03 15:00:30
375
原创 快应用开发之fetch接口请求封装
api.jsimport $fetch from '@system.fetch'const BASE_URL = '***'; // 写固定域名端口function requestHandle(params) { return new Promise((resolve, reject) => { $fetch.fetch({ // 请求、请求头参数根据项目需求自行修改 url: `${BASE_URL}${param
2021-08-27 15:55:13
695
原创 web前端开发面试总结
21/7/21CSS部分一.如何适配不同分辨率屏幕？使用css3的@media(响应式布局)二.H5新特性有哪些？1：图形容器canvas2：video&audio，可以简单的在网页上播放视频音频<video src="movie/movie.ogv" width="320" height="240" controls="controls"></video>3：语义化元素header, section, footer, aside, n...
2021-07-28 15:16:48
280
原创 vue+element el-cascader级联选择器，点击lebel选中
官方文档只能在点击选择框的时候才能选中，在某些实际操作中需要点击lebel就选中,加上下面的代码就可以了mounted() { setInterval(function () { document.querySelectorAll(".el-cascader-node__label").forEach(el => { el.onclick = function () { if (this.previousElementSib
2021-01-09 19:06:10
380
原创 vue 前端表格导入与导出
excel导入到表格表格导入与导出，文末带Blob.js和Export2Excel.js导入按钮<input type="file" @change="import(this)" accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"/>导入方法import(obj) {
2020-05-29 15:09:14
575
原创 vue+element 表格数据进行转换、处理，如日期格式化，状态码转换
将后台返回的时间戳转换成格式化年月日日期，在表格中显示<el-table-column align="center" prop="time" :formatter="dateFormat" label="时间" :resizable="false"> <
2020-05-19 17:45:32
2502
转载 a标签href无值,点击后刷新页面解决办法
<a href="javascript:void(0)" ></a><a href="javascript:" ></a>转载文章，侵删
2020-05-09 14:58:24
585
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人