封装ant design vue 的a-tree组件

封装ant design vue 的a-tree组件,不是下拉框树的组件哈!!!别看错了。

工作中某些人要求偷懒省的麻烦,想通过直接给定url就能完整渲染的。说实话,我感觉官方给的已经很好用得了,也不是啰嗦的代码,而且我这项目一个项目用了两个地方都没有。反正挺无语的吧,于是自己尝试着搞了搞,功能肯定没有官网那么全面,但是基本使用肯定是没得问题的。需要的宝贝们可以收藏一波啦。可花费了我不少心思呢!!!!



注意点:

1.此组件只配置了checkedkeys  ,expendedkeys,其余的就没搞双向绑定了。

2.例子在代码里面,可以直接用

3.有些props配置如果你们拿去得稍微的对组件改改。比如urlPointer,keysPointer。这两个实际作用看代码注释,再配合代码应该看懂不是问题,其实不改组件也问题不大,只是父节点就得添加个一两行绑定了。

4.此组件默认情况下后端已经把树结构给你了,很多配置你就不需要动他了。如果你后端懒得搞就想搞你,那你就需要配置deelTreeData参数。

5.仔细看最后几个方法,包括全选,取消全选,展开全部,取消展开全部四个方法。父组件如果需要就可以直接使用。这个应该没有问题,我好像还没有验证。

6.不会有小伙伴好奇getPublicSelectList方法是什么吧?这个根据每个人项目的接口封装不同而不同的。比如我这个

const getPublicSelectList = (url,params)=>getAction(url,params);

反正兄弟们,这里根据你们代码封装的接口自己处理一个这种结构的应该问题不大 。

7.关于树结构的部分怎么自己处理可以看看这里树数据处理

8.待优化的地方肯定是有的,反正能简单则简单,想到啥就弄啥 ,发现代码中还是有点多余的部分,不过问题不大。能用不报错

你可能感兴趣的:(笔记,前端,踩坑之路,vue.js,前端,javascript,anti-design-vue)