做项目过程中问题小汇总 | vue3 elementplus js

el-card去除阴影

html 复制代码
<el-card style="box-shadow: none;">
</el-card>

el-button按钮加图标

html 复制代码
<el-button type="primary" size="default" icon="Plus"
           @click="addRole">添加职位</el-button>

el-table表头的文字居中

:header-cell-style="{textAlign: 'center'}"、加边框 border

html 复制代码
<el-table :data="PermisstionArr" style="width: 100%; margin-bottom: 20px" row-key="aid" 
      border :header-cell-style="{textAlign: 'center'}" >
        <el-table-column label="名称" prop="aname"></el-table-column>
        <el-table-column label="权限值" prop="code"></el-table-column>
        <el-table-column label="修改时间" prop="updatetime"></el-table-column>
    </el-table>

el-table树形结构默认展开 default-expand-all

html 复制代码
<el-table :data="PermisstionArr" style="width: 100%; margin-bottom: 20px" row-key="aid" 
      border :header-cell-style="{textAlign: 'center'}"  default-expand-all >
 ......
</el-table>

JS找出对象数组中某个key的所有value

javascript 复制代码
let array = [
  { name: 'Apple', aid: 10101 },
  { name: 'Banana', aid: 10102 },
  { name: 'Cherry', aid: 10103 }
];

let allaid = array.map(item=>item.aid)

JS 从一个数组中删除另一个数组中不存在的元素

javascript 复制代码
const aids = [
  10101, 10102, 10103,
  10104, 10201, 10202,
  10203, 10301, 10302,
  10303, 10304
]

const array = [10101, 22222]

22222 在aids中不存在,所以要把 22222 从array数组中剔除

javascript 复制代码
function removeNonExistingElements(arr1, arr2) {
  return arr1.filter(item => arr2.includes(item));
}

const result = removeNonExistingElements(aids , array );

JS 数组截取固定的值

csharp 复制代码
array.slice(开始索引,结束索引)

vue3 控制台怎么不要提示vue warn

  • main.ts
javascript 复制代码
const app = createApp(App)
app.config.warnHandler=()=>null

el-tree

setCheckedKeys

setCurrentKey

html 复制代码
<el-tree  ref="tree">
</el-tree>

<script>
let tree = ref<any>();//获取tree组件实例
//清空选中的节点
tree.value.setCheckedKeys([])
</script>

el tree 获取选中节点 getCheckedNodes

javascript 复制代码
tree.value.getCheckedNodes()
相关推荐
朕的剑还未配妥16 分钟前
vue2中transition使用方法解析,包含底部弹窗示例、样式未生效踩坑记录
前端·vue.js
w***741722 分钟前
SpringBoot + vue 管理系统
vue.js·spring boot·后端
灵犀坠28 分钟前
前端核心知识体系梳理:从Vue 3到现代CSS与JavaScript
前端·javascript·vue.js
lcc18731 分钟前
Vue3 新的组件
前端·vue.js
幸运小圣40 分钟前
递归(Recursion)快速上手指南【JS例子】
开发语言·javascript·ecmascript
l***370942 分钟前
Docker部署Spring Boot + Vue项目
vue.js·spring boot·docker
我叫张小白。1 小时前
Vue3 基本生命周期:组件的一生之旅
前端·javascript·vue.js·前端框架·vue3
QH_ShareHub1 小时前
R 包中的生命周期触发函数全解析
前端·javascript·数据库
AI3D_WebEngineer1 小时前
企业级业务平台项目设计、架构、业务全解之平台篇
前端·javascript·vue
汤姆Tom1 小时前
前端转战后端:JavaScript 与 Java 对照学习指南 (第二篇 - 基本数据类型对比)
java·javascript·全栈