c_qianxia5040的博客

一个表单，有两组需要输入密码的地方，两组都被填充用户名密码，其中一组是其他信息，不是用户名密码，也被填充了，且input背景色是白色，表单中的input已经手动配置为无背景色，这种情况和浏览器自动填充用户名和密码有关，element表单中，需要将表单设置为autoComplete=“new-password”。但是在element UI里面设置autoComplete="off"是不生效的，需要设置为new-password，如上面所示。

【代码】element 日期时间组件选择器精确到小时，并且禁止选分钟和秒的配置。

原因：form 表单中只有一个输入框，在输入框中按下回车就是提交该表单，且会刷新页面。阻止这一默认行为，可以 在 form 标签上添加 @submit.native.prevent就可以解决刷新整个页面的问题。按enter键本来是调用搜索接口，但却是刷新了整个页面。

1、表格上绑定ref。2、清空用户选中数据。

在弹出框的定位出现问题时，可将该属性设置为 false。如图所示，选择之后，位置跑到了左上角。

setCurrentKey 通过 key 设置某个节点的当前选中状态，使用此方法必须设置 node-key 属性。node-key=“id” 每个树节点用来作为唯一标识的属性，整棵树应该是唯一的。highlight-current 是否高亮当前选中节点，默认值是 false。ref=“tree” 方便后面取值。第二步：设置当前高亮的节点。第三步、样式修改（非必须）第一步、添加相应属性。

其中value指定取值id，所以handleAreaChange中获取到的是选中的id值。但控制台输出的的inputValue是有值的，取整个对象，想取什么值就取什么值，完美。value绑定了id，可以获取id值。想要同时获取到lable值。

原因：vue 示例上 dateFormat 跟 element 计算属性冲突了。解决：将dateFormat全局替换掉就可以了。

可以通过指定 Table 组件的 row-class-name 属性来为 Table 中的某一行添加 class，表明该行处于某种状态。2、根据每行数据的不同动态添加不同的类名。

需求：想通过加标签的方式给字段加样式极坐标好像和其他的图表不太一样，其他的图表处理formatter时可以自定义样式，加标签处理，但极坐标直接把标签给显示出来了，不去解析标签如返回写成页面也会把毫无保留的显示出来，如下图找到一种曲线救国的方式就是通过属性给某个字段设置样式如果哪位博主能通过加标签的方式写样式，还请评论区留言，多谢...

通过设置参数可以控制滚动方式（无缝或按步）和滚动方向（上下左右）

1、将accordion设为true,只展开一级:accordion="true"2、控制默认展开某一项node-key指定关联字段，并把要展开的字段值以数组的方式复制给属性default-expanded-keys即可node-key="id":default-expanded-keys="[1652695]"...

结构：<el-table :data="topicTableData" :span-method="objectSpanMethod" border style="width: 100%; margin-top: 10px"> <el-table-column prop="func" label="功能"/> <el-table-column prop="desc" label.

后台管理列表，新增没有问题，当修改复制后重新编辑input框修改不了，el-checkbox也勾选不了，都是同样的问题没有赋默认值<el-input @input="inputChange" v-model="form.name" placeholder="请输入任务名称" size="small"/><el-checkbox v-model="timeForm.playMode">随机播放</el-checkbox>解决方案：form:{ name:

添加了点击表格中的行事件，但当我点击行内的按钮执行其他操作时，也会触发点击行事件解决方案，只需在结构中点击时加.stop阻止冒泡即可

搜了很多都是说在表格中失效的问题，但我遇到的是在表单中，点击加减只能加减一次，再点不生效主要原因是没有赋默认值，解决了 <el-input-number v-model="volForm.volume" controls-position="right" :min="0" :max="56" size="small"/>volForm: { volume:0 },...

<el-popover trigger="click" :content="showPoptip" :popper-class="showPoptip === 'true' ? 'modal_popper' :'hidePopper'" > </el-popover>原理：根据控制条件添加类名隐藏弹框第一步、添加控制条件 :content=“showPoptip”第二步、根据显示条件添

像elementUI的tooltip、popover这种渲染出来的元素都是在body下面一层，所以你在组件里面去加样式发现根本不生效官方文档中提供的有一属性 popper-class 为 popper 添加类名只需要加一个自定义类名，与加不加scope无关，亲测有效效果图：（修改了背景色，长度超出滚动等）...

.el-input--prefix .el-input__inner{ color: #eee; background-color: rgba(1, 28, 82, 0.8); } .el-input--prefix .el-input__inner{ padding-left: 40px; } .el-input__prefix{ width: 30px; .el-icon-date:befo.

<div class="select_btn"> <el-select v-model="subItemVal" size="small" style="width: 120px" :popper-append-to-body="false"> <el-option v-for="(item,i) in subItemData" :key="i" :label="item.name" :value="item.number" /> .

直接上代码样式： .tree_container{ height: 500px; border-radius: 5px; background-color: rgba(1,28,82,.5); } .el-tree{ background: transparent; color: #fff; .

效果如图<el-table stripe :data="tableData" :cell-style="columnStyle" height="150"> <el-table-column label="#" align="center" type="index" width="70"/> <el-table-column label="楼层" align="center" prop="floor" />

官方给出的content是一些文本，如果想插入html结构，可以通过 slot 传入 DOM<el-popover placement="top-start" width="400" trigger="hover" > <ul> <li>1</li> <li>2</li> </

<el-date-picker clearable size="small" v-model="dates" type="datetime" value-format="yyyy-MM-dd" placeholder="选择日期" :picker-options="pickerOptions"> </el-date-picker>1、只能选择今天（包含今天

<el-date-picker v-model="aaa" type="datetime" placeholder="选择日期"> </el-date-picker>结果选择日期时报错"TypeError: mask.replace is not a function"出错原因vue 示例上 dateFormat 跟 element 计算属性冲突了解决办法一、全局替换下这个方法例如将dateFo

效果图<el-date-picker v-model="value" align="right" type="monthrange" placeholder="选择日期" :picker-options="pickerOptions"> </el-date-picker>pickerOptions: { disabledDate(time) { return time.getTi

elementUI中的表格有一个属性:header-cell-style="{background:’#2EC7C9’,color: ‘#fff’}"<el-table style="margin-left:100px" stripe :data="tableData" id="out-table" :header-cell-style="{background:'#2EC7C9',color: '#fff'}" > <el-ta

在表单中添加 @submit.native.prevent，阻止表单默认提交行为<el-form @submit.native.prevent></el-form>

无论加important还是deep ，发现怎样也改不了下拉框的样式，点击元素发现下拉框与script标签是同级的（看下图）官方文档上写加 :popper-append-to-body=‘false’ ，再修改样式，但对我好像没有用官方文档上写还有一个属性，可以给下拉框添加类名，发现这个可以，但是样式不能加scope，这点就很重要，否则样式还是无效最终方案，添加类名popper-class=“popper_select”，去掉scope ，看代码<el-select v-model

下拉框为多选时，绑定的值为数组状态，所以点击编辑赋值时，需要处理为数组但我遇到的问题是，可以赋值，但不是想要的结果，我想要显示label，但显示的是value不想得到的效果：想要的是：其实在赋值后面加“map(Number)”就可以了，我也不太懂，懂得可以下方评论回复我看代码<el-form-item label="通知对象：" prop="userIds"> <el-select v-model="form.userIds" filterable multiple

重点在 ref=“cascaderAddr” 监听改变事件@change=“addHandleTypeChange”获取选中的label数组(注意：在 2.9.2 后官方新增了 getCheckedNodes() 方法) ： this.$refs.cascaderAddr.getCheckedNodes()[0].pathLabels<el-cascader ref="cascaderAddr" :props="{ checkStrictly: true ,value: 'id