繁体   English   中英

我如何才能将数据XML存储到Sencha Extjs的Tree列表中?

[英]How i can get data XML into store then into Tree list in Sencha Extjs?

在这里任何可以帮助我的人,我只想先将数据放入存储中,然后再放入Sencha Extjs的树列表中,但我什么都不知道,因为到目前为止我是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>

Main.js代码:

items: [{
    xtype: 'treelist',      
    reference: 'treelist',
    expanderOnly: false, 
    listeners:{
        selectionchange :'treeNodeSelect' 
    },
    bind: '{navItems}',
}],

商店所在的我的模态数据:

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结构上的几件事:

  1. 您没有关闭第一个<root>标记。
  2. <leaf>true</leaf><leaf>false</leaf>标记所有节点是明智的。
  3. 您的最后一个元素具有children元素,但没有文本,并且没有标记为<leaf>false</leaf> ,因此它将破坏树结构,因为它没有包含子元素的节点。

您的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>

另外,您的xml阅读器也不需要rootProperty因为它是root但是您只希望与其父项相关的第一个元素被视为记录,因此您的record应该是: > element

stores: {
    navItems: {
        type: 'tree',
        autoLoad: true,
        proxy: {
            type: 'ajax',
            url : 'test.xml',
            reader: {
                type: 'xml',
                record: '> element'
            }
        }
    }
}

检查这个小提琴: https : //fiddle.sencha.com/#view/editor&fiddle/23pv

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM