English 中文(简体)
如何用 ExtJs 4 创建多页应用程序
原标题:How to create multi-page app with ExtJs 4

我应该创建 ExtJs4 应用程序, 该应用程序应该有主菜单, 每个菜单项应该用不同的 url 打开新页面, 所以如果用户复制其它浏览器标签上的 url 和 pastes, 该应用程序应该打开该菜单项 。

我想使用 ExtJss 推荐的 MVC 结构, 但我不知道如何用多页/ urls 来使用它。 所有的例子都使用单页 。

一个选项是每次当用户点击特定菜单项时都重新装入页面, 所以每个URL/ 菜单项/ page 都将是单独的 ExtJS 应用程序, 并使用 MVC 。 但我认为这个方法有缺点, 因为每次该页面都会重新加载, 并且对性能不利 。 它也给重新使用组件( 通用模型、 仓库和不同页面的视图) 带来困难 。

因此,我希望所有页面都有一个单一的应用程序,但我不知道有什么解决办法可以让不同的观点有不同的URL(就我而言:对于不同的菜单项目)。

或者,是否有另一种办法来进行这种应用?

问题回答

你可能想要使用一个视图港, 把中区变成一个集装箱。

中区集装箱通常配有卡片或标签布局。

当用户浏览到新视图( commonent) 时, 您会将该视图添加到容器中, 并激活它 。

最大的错误是先更改 URL。 您不想这样做 。

您想要导航, 如果导航成功, 然后设置 URL 。 您可能不应该使用 ExtJS 历史 组件, 因为它被错误地执行 。 我建议使用 HTML5 推进状态 。

您应该确保您的导航系统在不更改 URL 栏的情况下工作 。

我建议阅读关于微软棱晶、WPF和银光导航的论文,

http://msdn.microsoft.com/en-us/library/gg430881(v=pandp.40).aspx

以下是导航过程的例子:

  • 调用 app. requestNavigate( 联系人/ 5) ; 您会自己添加这个 。

  • 您将此片段解析为 :

navigationContext = {  
  fragment:  contacts/5 ,  
  xtype:  contacts-form ,  
  parameters:{  
    id: 5  
  }  
}

备选案文:如果使用表格:

  • 从导航区域( 您的中心区域) 获取活动项。 如果存在, 请调用 < code> confirmedNavigation Request( 回召) 。 您需要添加此方法或事件 。

  • 如果 回召( true) , 继续导航。 这样用户就可以取消导航, 如果表单是“ 脏” 的话 。

十二、在《任择议定书》下

  • the easy way is to then create a new widget of navigationContext.xtype, add it to the navigation region, then call setActiveItem(widget). destroy the previous active item if it existed.

然后调用 history.pushstate( 无效、 无效、 导航comtext. fraftgment) (null, null, null, 导航comtext. fraftgment)

然后在视图上提出一个导航事件,通过上下文,然后从该视图上加载数据。

更先进的设想方案包括:

  • 如果您希望返回, 则保持上一个部件的活性。 添加一个保存活性属性, 如果是, 在容器中添加新部件时不要销毁 。

  • 搜索容器并询问每个部件是否想要处理当前的导航请求(例如,如果在您的导航区域已经隐藏了装有联系人-5的表格,或者如果您想要重新使用表格)





相关问题
ExtJS load form items/fields from database

I am using ExtJS 3 here. I would like to populate a formpanel from database with fields to be submitted. Basically, I don t know witch fields my form will have and I want to generate all formpanel ...

How to use Ext JS for role based application

I am planning to use Ext JS for a large application. The application s features are role based. When user login, they only see menu and screen features related to them. My server side technology will ...

Dynamically adding a TabPanel to a Panel Region

I have a Panel layout with a TreePanel in one region. A user clicks on an node in the tree and a TabPanel should be displayed in another region with information, editing tools etc. for that tree node....

How to embed Json result within Extjs Panel?

I have some issues with Json result and embed it within the html of the Extjs Panel. Here s that I have managed to get so far. myPanel is embedded within a mainPanel, and I have some shows/hide of ...

Ajax data update. Extjs

I need to keep certain data ( in a grid) up to date and was gonna do a poll to the server every 15 seocnds or so to get the data and refresh the grid, however it feels a bit dirty ( the grid will have ...

Better way to call superclass method in ExtJS

All the ExtJS documentation and examples I have read suggest calling superclass methods like this: MyApp.MyPanel = Ext.extend(Ext.Panel, { initComponent: function() { // do something MyPanel ...

Merged Headers in Ext JS Grid

Is it possible to have two headers in Ext JS grids? I have to show my grid as grouped data.. for example product types and products. In my case I need a grid like this: Field | Product Type A ...