Как использовать js:Datagrid для динамического обновления поставщика данных

js:dataGrid показывает пробелы вместо данных.

Компонент dataGrid:

<j:VGroup id="VGroupContainer">
                <j:Button text="Load Data" width="200" height="60" click="OpenData(event)"/>

                <js:DataGrid  rowHeight="40" y="200" visible="true" id="dataGrid"  width="330">

                    <js:columns>
                            <js:DataGridColumn label="Name" dataField="Name" id="nameField" columnWidth="130"/>
                            <js:DataGridColumn label="SO" dataField="SOname" id="soField" columnWidth="100"/>
                            <js:DataGridColumn label="Email" dataField="Email" id="emailField" columnWidth="100"/>
                    </js:columns>

                </js:DataGrid>
</j:VGroup>

Функция для динамического обновления данных. В качестве контекста я буду использовать вызовы HTTPservice для получения данных с сервера и соответствующего обновления сетки данных. Для целей тестирования я использую следующее:

protected function OpenData(event:MouseEvent):void
        {


                    var obj:Object=new Object();

                    obj.Name = "record 1"
                    obj.SOname = "SO1"
                    obj.Email = "email 1"
                    var obj2:Object=new Object();

                    obj2.Name = "record 2"
                    obj2.SOname = "SO2"
                    obj2.Email = "email 2"
                    var obj3:Object=new Object();

                    obj3.Name = "record 3"
                    obj3.SOname = "SO3"
                    obj3.Email = "email 3"

                    arrData.addItem(obj)
                    arrData.addItem(obj2)
                    arrData.addItem(obj3)

              dataGrid.dataProvider = arrData;

        }

Всякий раз, когда я устанавливаю для dataProvider значение, dataGrid, кажется, имеет правильные строки, но данные не отображаются. На самом деле вы можете щелкнуть и выбрать строку, но визуально ни одна из ячеек не отображается:

После обновления поставщика данных

Кто-нибудь работал с Datagrids в apache royale в последнее время? Мне интересно, использую ли я правильный компонент. Я перехожу с s: Datagrids и никогда не сталкивался с этой проблемой.


apache-royale
person Bash    schedule 24.09.2019    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Вы используете базовую реализацию, которая спроектирована так, чтобы быть очень легкой, но упускает некоторые функции, которые поставлялись со встроенной реализацией flex.

Если вы переходите со Spark, может быть проще использовать компоненты эмуляции Spark [1].

Если вы хотите сохранить облегченную реализацию и добавлять функциональность по мере продвижения, вы можете просто добавить уведомление об изменениях [2].

[1] https://github.com/apache/royale-asjs/blob/develop/examples/mxroyale/tourdeflexmodules/src/spark/controls/DataGridExample.mxml

[2] https://github.com/apache/royale-asjs/blob/9db99c214d6ca9c300a11489d2421cf6920e9de4/examples/royale/ListExample/src/main/royale/MyInitialView.mxml#L178

person yishayw    schedule 25.09.2019
comment
Спасибо за ответ. Чтобы уточнить: да, я действительно мигрирую искру. Я установил config: flex в файле asconfig (используя VSCode). Однако я попытался использовать mx: Datagrid. он компилируется правильно, но отображается пустым. Однако я обнаружил ошибку в консоли браузера: Uncaught Error: необходимо установить assert columnContainerClass для DataGrid! . Я не уверен, что вызывает это. Не уверен, что я что-то пропустил при правильной настройке файлов конфигурации/проекта (для использования компонентов spark/mx) - person Bash; 26.09.2019
comment
Пример [1] работает для вас? Вы пытались добавить уведомление об изменениях [2]? Если у вас есть простой тестовый пример, самым полезным было бы открыть вопрос [3]. [3] github.com/apache/royale-asjs/issues - person yishayw; 27.09.2019
comment
Я пробовал [1], но после компиляции в консоли отображалось пустое место с ошибкой. Сегодня я работаю над подходом [2] и поделюсь своим опытом. - person Bash; 28.09.2019