Javascript 如何将数据XML存入存储区,然后放入Sencha Extjs中的树列表中?

Javascript 如何将数据XML存入存储区,然后放入Sencha Extjs中的树列表中?,javascript,xml,extjs,Javascript,Xml,Extjs,这里的任何人都可以帮助我,我只想先将数据放入store,然后放入Sencha Extjs中的treelist,但我什么都不知道,因为我是Sencha的新手,到目前为止,我使用以下代码: XML代码: <?xml version="1.0" encoding="UTF-8"?> <root> <expanded>true</expanded> <children> <element> &l

这里的任何人都可以帮助我,我只想先将数据放入store,然后放入Sencha Extjs中的treelist,但我什么都不知道,因为我是Sencha的新手,到目前为止,我使用以下代码:

XML代码:

 <?xml version="1.0" encoding="UTF-8"?>
 <root>
  <expanded>true</expanded>
  <children>
     <element>
        <text>Home</text>
     </element>
     <element>
        <children>
           <element>
              <leaf>true</leaf>
              <text>Messages</text>
           </element>
           <element>
              <leaf>true</leaf>
              <text>Music</text>
           </element>
        <element>
              <leaf>true</leaf>
              <text>Video</text>
           </element>
        </children>
        <text>Users</text>
     </element>
     <element>
        <text>setting</text>
     </element>
     <element>
        <children>
           <element>
              <leaf>true</leaf>
              <text>University</text>
          </element>
         </children>
        </element>
  </children>
存储所在的我的模式数据:

Ext.define('AppName.view.tree.TreeListModel', {
    extend: 'Ext.app.ViewModel',
    alias: 'viewmodel.tree-liststore',
    fields: ['expanded', 'children', 'leaf', 'text'],
    data: {
        name: 'AppName',
    },
    stores: {
        navItems: {
            type: 'tree',
            proxy: {
                type: 'ajax',
                url : '/classic/resources/test.xml',
                reader: {
                    type: 'xml',
                    record: 'children',
                    rootProperty: 'root'
                }
            }
        }
    }
});

关于XML结构,有以下几点:

  • 您没有关闭第一个
    标记
  • 明智的做法是用
    true
    false
    标记所有节点
  • 最后一个元素有
    子元素
    ,但它没有文本,也没有标记为
    false
    ,因此它将破坏树结构,因为它没有包含子元素的节点
  • 您的XML应该如下所示:

    <?xml version="1.0" encoding="UTF-8"?>
    <root>
        <expanded>true</expanded>
        <children>
            <element>
                <text>Home</text>
                <leaf>true</leaf>
            </element>
            <element>
                <text>Users</text>
                <leaf>false</leaf>
                <children>
                    <element>
                        <leaf>true</leaf>
                        <text>Messages</text>
                    </element>
                    <element>
                        <leaf>true</leaf>
                        <text>Music</text>
                    </element>
                    <element>
                        <leaf>true</leaf>
                        <text>Video</text>
                    </element>
                </children>
            </element>
            <element>
                <text>Setting</text>
                <leaf>true</leaf>
            </element>
            <element>
                <text>Some Name Here</text>
                <leaf>false</leaf>
                <children>
                    <element>
                        <leaf>true</leaf>
                        <text>University</text>
                    </element>
                </children>
            </element>
        </children>
    </root>
    

    检查这把小提琴:

    我有一个问题,这段代码对我有用,谢谢,我还学习了一些概念,但我不明白你所说的“记录:'>element'到底是什么意思”基本上,这意味着你的整个树已经加载到了这个结构中,每次你扩展一个记录,它就不会试图从服务器加载更多的记录。hy@Guilherme你能帮我吗
    <?xml version="1.0" encoding="UTF-8"?>
    <root>
        <expanded>true</expanded>
        <children>
            <element>
                <text>Home</text>
                <leaf>true</leaf>
            </element>
            <element>
                <text>Users</text>
                <leaf>false</leaf>
                <children>
                    <element>
                        <leaf>true</leaf>
                        <text>Messages</text>
                    </element>
                    <element>
                        <leaf>true</leaf>
                        <text>Music</text>
                    </element>
                    <element>
                        <leaf>true</leaf>
                        <text>Video</text>
                    </element>
                </children>
            </element>
            <element>
                <text>Setting</text>
                <leaf>true</leaf>
            </element>
            <element>
                <text>Some Name Here</text>
                <leaf>false</leaf>
                <children>
                    <element>
                        <leaf>true</leaf>
                        <text>University</text>
                    </element>
                </children>
            </element>
        </children>
    </root>
    
    stores: {
        navItems: {
            type: 'tree',
            autoLoad: true,
            proxy: {
                type: 'ajax',
                url : 'test.xml',
                reader: {
                    type: 'xml',
                    record: '> element'
                }
            }
        }
    }