javascript - NativeScript UI 构建器

标签 javascript nativescript uibuilder

我尝试构建一个简单的类似表单的用户界面,我想在其中动态添加多个文本字段的行。我使用 XML 和 JS 构建了一个自定义组件,因为这些文本字段(开始、结束、持续时间)中有一些交互。

我是 NativeScript 的初学者,但我已经开始使用数据绑定(bind)和事件结构了。我可以通过 ui/builder 添加自定义组件。我完全陷入困境的是为该组件实例获取“选项/参数”。 我试图完成的是:添加我的自定义组件并为其提供一些应填充到组件 Obsverable 中的数据。在稍后(保存)操作中,我希望能够从我的“主” View 中检索这些数据。

我的结构是这样的:

main.js

exports.loaded = function(args) {
    var page = args.object;
    page.bindingContext = model;

    var outerContainer = page.getViewById('outerContainer');

    var vma = builder.load({
        path: 'widgets/durationRow',
        name: 'durationRow'
    });

    outerContainer.addChild(vma);
};

自定义组件“durationRow.js”

var componentModel = new Observable({
    label:      "",
    start:      "",
    end:        "",
    duration:   ""
});

exports.onLoad = function(args){
    var container = args.object;
    container.bindContext = componentModel;
};

我尝试通过exports.componentModel导出componentModel并从main中寻址vma.componentModel。但 vma 是一个 View 而不是“JS 模块”。 我真的很困惑,没有找到任何像我的场景那样做的例子。

任何人都可以为我指明正确的方向,如何以正确的(或任何)方式做这些事情?

谢谢!

最佳答案

所以这个问题的答案非常简单:阅读 documentation :)

有一个选项attributes正好可以用于此目的。我最终得到了这个:

var row = builder.load({
    path: 'widgets/durationRow',
    name: 'durationRow',
    attributes: {
        bindingContext: bindingModel
    }
});
container.addChild( row );

在加载的小部件中,我将获得“插入”模型作为绑定(bind)上下文:

exports.onLoad = function(args){
    page = args.object;
    var model = page.bindingContext;
};

希望这会有所帮助!

关于javascript - NativeScript UI 构建器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38991268/

相关文章:

javascript - 在网格中指定默认排序

javascript - 如何获取嵌套对象的键

cocoa - 如何采取行动关闭 NSPopover?

javascript 将数字与对象键进行比较并获取最小的值

javascript - 如何将变量从嵌入式 SVG 发送到 HTML 文档?

javascript - 如何在 NativeScript 中使用按钮样式选择器

javascript - 将 MQTT NPM 模块导入 NativeScript

javascript - NativeScript Firebase es6 promise 出现奇怪的行为

iphone - iPad/iPhone 上的低吼类型通知?

widget - 在 Spec 中添加一行会导致一列?