我使用 web-ui 创建了一个基本的数据网格进行测试,并且它工作得很好。然后我决定尝试将其声明为组件。我改变了库引用,现在当我尝试运行应用程序时它给了我上述错误。你可以在下面看到我的文件结构。当我尝试运行它时收到“不明确的引用”消息的原因是,当我进入 out 目录中自动生成的 DataGrid.dart 文件时,它具有以下声明
import 'DataGrid.dart';
...
import '../DataGrid.dart';
我很困惑为什么生成的代码会同时导入它们。我考虑的一件事是,这可能是因为 DataGridPage.html 文件实例化了我的 DataGrid 组件,而我的 DataGridPage.dart 文件导入了 DataGrid.dart,因此它可以引用 DataGridColumn(它需要为 DataGrid 设置列)。在 DataGridPage.dart 中,我还附加到某些 DataGrid 事件,例如 SortColumnChanged 和 SelectionChanged,因此我需要在 DataGridPage.dart 中请求我的 DataGrid 实例的副本(我认为没有办法附加到来自 Web 组件的事件DataGridPage.html 中的实例化)。
关于我做错了什么的任何想法?
这是我的文件结构:
DataGrid.dart
--------------------------------------------
library datagrid;
...
part 'DataGridColumn.dart';
part 'DataGridRow.dart';
class DataGrid extends WebComponent{...}
DataGridRow.dart
--------------------------------------------
part of datagrid;
class DataGridRow {...}
DataGridColumn.dart
--------------------------------------------
part of datagrid;
class DataGridColumn {...}
DataGrid.html
--------------------------------------------
[contains the component declaration UI]
DataGridPage.html
-----------------------------------------
...
<div is="s-datagrid" id="myDataGrid" ItemsSource="{{app.Assets}}" Columns="{{app.Columns}}"></div>
...
DataGridPage.dart
--------------------------------------------
import 'DataGrid.dart';
import 'Asset.dart';
void main() {
}
DataGridApp _app;
DataGridApp get app {
if (_app == null) {
_app = new DataGridApp();
}
return _app;
}
class DataGridApp{
//provides ItemsSource and DataGridColumn data
}