ExtJs6中利用TreePicker实现下拉树

最新推荐文章于 2020-12-23 08:22:02 发布

wangqiu198957

最新推荐文章于 2020-12-23 08:22:02 发布

阅读量1.4k

点赞数 3

文章标签： extjs下拉树下拉树 treePicker extjs6

本文链接：https://blog.csdn.net/wangqiu198957/article/details/97639270

版权

本文介绍了如何在ExtJS6中使用TreePicker组件创建下拉树形结构。通过引入必要的资源文件，配置treePicker控件，并自定义下拉层宽度，实现了从本地数据加载树形数据的功能。详细步骤包括引入ExtJS主题和TreePicker.js，以及初始化和调整宽度的代码示例。

摘要由CSDN通过智能技术生成

最近做的项目中有用到Extjs6，自己特意也做了程序用来练习使用Extjs6。在此记录一下使用Extjs6中遇到的问题。

如果有使用过Extjs的小伙伴们，一定知道在Extjs中有个combobox控件，这个主要用来下拉显示数据。但是如何实现在下拉时展示树形结构呢？今天就来介绍Extjs中的treePicker插件，该插件扩展了combobox，使下拉时展示出来的是个树形结构。先来看看效果图：

1.首先页面引入Extjs主题、extjs所需的主要的js文件和TreePicker.js文件。其中TreePicker.js在packages/ux/classic/src文件夹下。

2.构建treePicker控件并初始化到window上：

说明：因为本人使用本地数据做的测试，因此直接将json数据赋值到root上了。请求服务器数据的伙伴请自行百度搜索赋值方式。

<script type="text/javascript">
        Ext.onReady(function () {
            var fstore = Ext.create('Ext.data.TreeStore'

关注