1、form 下面只有一个 input 时回车键刷新页面 原因是触发了表单默认的提交行为，给el-form 加上@submit.native.prevent就行了。 <el-form inline @submit.native.prevent> <el-form-item label="订单号"> <el-input v-model="query.orderNo" :placeholder=
效果如图 第一步 el-table标签加两个属性 show-summary //显示底部栏 :summary-method="getSummaries" // 自定义底部栏数据方法 然后自定义方法 主要是 return sums是显示底部的数组里面对应列表底部的每一列 getSummaries(param) { console.log(param.data)
效果图如下 通过slot-scope="scope" 与v-if搭配data数据传过来的值显示不同按钮 <template slot-scope="scope"> <el-button type="text" class="btn_green" v-if="scope.row.jjjj==0" @click="Details&quo
效果图如下单选切换，绑定数据 通过 slot-scope="scope" 绑定 传过来的bbbb实现数据绑定切换 可以打印scope.row会发现是 el-table 的 :data 绑定的数组 <el-table-column prop="bbbb" fixed="right" width="150" type="radio"> <t
一、效果 功能：使用接口调回来的数据，显示出可选的项，并开始有默认的选项值。 二、主要代码 <el-cascader ref="cascaderAddr" :options="rangeArr" :props="optionProps" v-model="plable" @change="handleChange3" style="width: 100%;"></e
原因是因为node-sass的版本过高； 方法一： 卸载重新安装低版本的内容 1.npm uninstall sass-loader 2.npm install sass-loader@5.0.0 （安装仍然报错，则可能是sass-loader需要依赖node-sass,因此安装yarn install node-sass） 方法二： 使用::v-deep来代替/deep/ 例如： .home_warp .home_
1.EL表达式 1.1 EL表达式定义 Expression Language（表达式语言） 1.2 EL功能 替代JSP页面中数据访问时的复杂编码 1.3为什么使用EL A.<%= ( (User) request.getAttribute(“user”) ) .getName() %> jsp要导包tomcat jsp.api servlet.api B.${user.name} EL不用导包 A等价于B，所
生命周期钩子 生命周期 每个 Vue 实例在被创建时都要经过一系列的初始化过程： 创建实例，装载模板，渲染模板等。 Vue为生命周期中的每个状态都设置了钩子函数（监听函数）。 每当Vue实例处于不同的生命周期时，对应的函数就会被触发调用。 钩子函数，不能使用箭头函数来定义一个生命周
<el-time-picker v-model="addForm.startTime" :picker-options="{ selectableRange: '00:00:00- 23:59:59' //时间选择器,控制可选择的时间范围 }" format="HH:mm" //使用format指定输入框的格式 va
element ui +vue2 实现el-dialog拖动放大弹窗 1、在libs文件夹内创建dialog.js dialog.js内容如下： import Vue from 'vue'; // v-dialogDrag: 弹窗拖拽属性 Vue.directive('dialogDrag', { bind(el, binding, vnode, oldVnode) { const dialogHeaderEl = el.querySele
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="app"> <label v-for="(item,key) in originHobb
一、简介 Spring的表达式语言，简称SpELl，是一个支持运行时检查和操作对象图的强大的表达式语言，和我们之前学习过的JSP中的EL表达式类似，SPEL使用的是#{}作为定界符，所有在大括号中的字符都被认为的SPEL，SPEL为bean的属性进行动态赋值提供了非常大的便利 二、 SpringEL的使用 （1）通过be
Watch概述 一个对象，键是需要观察的表达式，值是对应回调函数。值也可以是方法名，或者包含选项的对象。Vue 实例将会在实例化时调用 $watch()，遍历 watch 对象的每一个属性。 <body> <div id="app"> <input type="text" v-model="num"> </div> <script src="vue.js">&
前言：最近在使用el-tree组件时，传给后端需要的数据是需要拼接起来的树形结构，el-tree 在选择后返回的数据并没有我想要的数据结构，需要前端手动拼接 <el-input placeholder="输入关键字进行过滤" v-model="filterArea"> </el-
可在App.vue中进行全局设置该滚动条样式，项目保持一致。 /** * 滚动条样式 */ ::-webkit-scrollbar { width: 6px; height: 6px; } /** * 滚动条的滑块 */ ::-webkit-scrollbar-thumb { background: #bbbbbb; border-radius: 8px; -webkit-box-shadow: inset 0 0 4p
思路 使用directives来绑定监听元素通过el获取到元素，添加监听事件在回调中写对滚动事件的处理 数据的传输 指令中书写的方法this的指向会更改，因此选择了属性的方式，binding.value获取 通过数据类属性获取一些数据通过方法类属性返回一些数据直接处理 其他 示例为上拉下拉都请
组件代码 template> <div> <el-tooltip class="item" effect="dark" ref="ellipse_tooltip" :content="tooltipContent" :placement="placement" > </el-toolt
VUE指令 回顾 HTML： html+html5 语义化标签（header,footer） css+css3 动画：过渡（transition），动画(animate), flex布局 , less Java Script： 数据类型 变量 运算 数学运算 比较运算 逻辑运算 流程控制 if switch for while do while 函数 DOM （document object model） BOM （browser object
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>element-ui table自动滚动</title> </head> <script src="https://cdn.jsdelivr.net/npm/vue"></script>
2021.9.23 坑86（el-table、default-sort、排序）：el-table 表格的自动/手动排序。自动：el-table自带能力。手动：自写排序函数处理事件。 el-table自动排序参考文档： Table 表格 | ElementPlus (element-plus.org) 排序Sorting部分。 在表格上设置 default-sort 属性即可自动排序
Vue 提供了 transition 的封装组件，在下列情形中，可以给任何元素和组件添加进入/ 离开过渡。 条件渲染 (使用 v-if)。 条件展示 (使用 v-show)。 动态组件。 组件根节点。 语法格式如下： <transition name = "nameoftransition"> <div></div> </transition> <!DOCTYPE html> <
/deep/.el-table .sort-caret.descending{ border-top-color:black; } /deep/.el-table .sort-caret.ascending{ border-bottom-color:black; } /deep/ .descending .sort-caret.descending{ border-top-color:#3958FE; } /deep/ .ascending .sort-caret.ascending{
本文基于B站尚硅谷的Vue学习教程，推荐大家去观看。 一. Vue简介 Vue是一套用于构建用户界面的渐进式js框架，它的学习可以分为以下6个部分。 Vue基础 vue-cli vue-router vuex element-ui vue3 Vue有三个主要的特点： 采用组件化模式，提高代码复用率、且让代码更好维护。 声明式编
el-checkbox-group这个组件与其他复选框不一样，我当初也是半天不知道怎么操作 页面使用v-model绑定 size就是等比例缩小放大，v-ror循环应该看的懂。重要的是@chage到我们写的类 <el-checkbox-group v-model="checked" size="medium"> <el-checkbox-button v-for=
使用el-upload组件上传没有其他要求时进度条显示是没有问题的，但是要对上传的数据进行特殊处理时（如转成base64等），就需要用自定义上传用http-request方法，这时进度条就不显示了或者显示有问题，查了很多资料大多数是针对单文件上传的，多文件上传几乎没有，于是自己决定实现一个 一、
