extjs 绑定 parent 的可绑定 属性 到 child 的

extjs bind parent's bindable property to child's

我有一个容器,其中包含一个或多个表单域。我想将 parent 容器的 hidden 属性 绑定到 child 项目的 disabled 属性 我们如何做到这一点?

我有一个fiddlehere来说明。我的可选容器中有一些字段是必需的。因此,当可见时,它们应该是必需的,当隐藏时,它们应该是可选的。我知道我可以添加一个可以设置 allowBlank: true 的处理程序,但这看起来很乏味。

你可以在hide\show听众的帮助下做到这一点fiddle

在 viewModel 中注册父级的隐藏状态,以在子组件中获取父级状态。

将 viewModel 中的 "containerHidden" 属性 更改为 true 或 false 以测试它。 here is fiddle

viewModel:{
    data:{
        containerHidden:true
    }
},
defaults: {
    labelAlign: "right"
},
items: [
    {
        xtype: "textfield",
        fieldLabel: "Name",
        allowBlank: false
    },
    {
        xtype: "datefield",
        fieldLabel: "Date of Birth",
        emptyText: "18+ gets more options",
        allowBlank: false,
        listeners: {
            change: "onDoBChange"
        }
    },
    {
        xtype: "container",
        reference: "AgeRestrictedArea",
        bind:{
            hidden:"{containerHidden}"
        },
        defaults: {
            labelAlign: "right"
        },
        items: [
            {
                xtype: "textfield",
                fieldLabel: "Hobby",
                allowBlank:false,
                bind:{
                    disabled: "{containerHidden}"
                }

            }
        ]
    }
]