Extjs 向手风琴内容添加网格面板

本文介绍了Extjs 向手风琴内容添加网格面板的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我实际上不确定这是否可能，但无论如何我都会问.我有一组手风琴控件，在每个控件的内容主体中，我需要显示一个网格面板.网格面板需要附加一个点击事件.我曾尝试简单地创建网格面板并将手风琴的 html 属性设置为它，但这不会产生任何内容.

I'm actually not sure if this is possible, but I will ask it anyway. I have a group of accordion controls, and within the content body of each I need to display a grid panel. The grid panel needs to have a click event attached to it. I have tried simply creating the grid panel and setting the html property of the accordion to it, but this produces no content.

有什么办法可以实现上述目标吗?

Is there somehow I can achieve the above?

推荐答案

您不能将 html 内容(由属性插入)与任何其他内容一起使用.如果您添加任何 item html 属性值不会设置/覆盖.但可以肯定的是，您可以将任何您想要的东西放入一个手风琴面板中.甚至是格子.但对于这种情况，根据最后一个问题，我建议您将视图引用到网格中.您可以简单地使用 ComponentQuery

You cannot have html content (inserted by the property) along with any other content. If you add any item the html property value will not set/overriden. But for sure you can place anything you want into one accordion panel. Even a grid. But for that case, and based on the last question, I would recommend you to reference the view into the grid. You may do this simply by using a ComponentQuery

点击事件可以通过使用控制 控制器的功能.

The click events can be applied by using the control function of the controller.

为了您的基本理解:

在 ExtJS 中，你很少使用纯 html 代码.在大多数情况下，您可以使用任何类型的组件.All 嵌套在 items-array 或 dockedItem-array 中.这些数组中的项目也由布局系统处理.

一些适用于控制功能的查询示例

在下面的this指的是控制器本身.

In the following this refers to the controller itself.

您知道网格的 ID(通常您没有这样做).Id 由起始 #

You know the Id of the grid (normally you didn't do this). Id's are marke by a starting #

control({'#yourId': {itemclick: this.onItemclick }});

您知道 xtype 并且这种类型只有一个实例.您还可以通过在 xtypes 之间使用空格来描述路径.

You know the xtype and that there is only one instance of this type. You can also describe a path by using spaces between the xtypes.

control({'grid': {itemclick: this.onItemclick }});

您已将自定义属性设置为 grid(您可以通过这种方式引用任何属性).这个完全兼容上面的那个.我推荐你使用这个

You have set a custom property to grid (you can refer any property this way). This one is fully compatible the the one above. I recommend this one in your case

control({'grid[customIdent=accordionGrid]': {itemclick: this.onItemclick }});

这只是使用 ComponentQueries 的一些方法，还有更多.有关更详细的解释，您应该参考 组件查询

This are just some ways to use ComponentQueries, there are more. For a more detailed explanation you should refer the sencha API for ComponentQuery

还要注意，每个组件都实现了up() 和 down() 方法也支持 ComponentQueries.

Also note that every component implements the up() and down() methods which also support ComponentQueries.

我忘了提及:对于一个控件，查询严格只需要返回一个结果(只会获取第一个结果)，另一方面，ComponentQuery 可以返回多个结果.

I forgot to mention: For a control the query strictly need to return just one result (only the first one will be taken) a ComponentQuery on the other hand can return multiple results.