Ext JS4 MVC でのViewport.jsって？

Ext JS 4のDocにある，MVC Application Architecture について，その内容を理解するために翻訳のようなことをしました。結果はこちらです。次に，そのとおりに実行してみました。がうまく動きませんでした。

Viewport.js が載っていない

この文書をチュートリアルのように実際に入力して実行しても最初からちゃんと動きません。

  • 追記：ExtJS 4.0.0 ではその通りちゃんと動きませんが，ExtJS4.0.1では動きます。その理由は，こちらですが後で見てください。

このエラーの6行目で指摘されている，「User.js がないぞ」というのはまったくご指摘のとおりで，まだ作っていないので当然です。しかし1行目のエラーは，Viewport.js がないというエラーは，身に覚えがありません。試しに，app.js の launch メソッドを単純なものにしてもこのエラーは発生します。また，User.js をドキュメント通りに作成しても，6行目のエラーは消えますが，当然ながら1行目のエラーは消えません。

本家の文章には，最初の方にファイル構造の一覧の図がありますが，この図の中にあって解説のない，ファイルがあります。それが Viewport.js です。

SDKのこのサンプルが入っているフォルダを見てみると，このファイルの内容は次のようなものでした。非常に簡単な内容です。

[js] Ext.define(‘AM.view.Viewport’, { extend: ‘Ext.container.Viewport’ }); [/js]

そこで，このファイルを作り，Viewport.js として保存してから実行すると，やっとサンプルが動き始めます。なるほど，ここにこういうファイルが必要なのはわかりました。では，このファイルはいつもこの内容で作成しておけばよいのでしょうか。それはわかりません。そのあたりは，今後，勉強していきたいと思います。

この件についてググってみたところ，本家のフォーラムで質問が上がっていました。

http://www.sencha.com/forum/showthread.php?131509-extjs-mvc-am&langid=14

これを見てみると，Viewport.js を作らなくても，app.js に

[js] autoCreateViewport: false, [/js]

と足すとよいって書いてあります。じゃあやってみました。

[js] Ext.application({ name: ‘AM’, appFolder: ‘app’, autoCreateViewport: false, controllers: [ ‘Users’ ], launch: function() { Ext.create(‘Ext.container.Viewport’, { layout: ‘fit’, items: [ { xtype: ‘panel’, title: ‘Users’, html : ‘List of users will go here’ } ] }); } }); [/js]

このようにすると，Viewport.js が見つからないというエラーは発生しません。

1 thought on “Ext JS4 MVC でのViewport.jsって？”

  1. ピンバック: 続）Ext JS4 MVC でのViewport.jsって？| Sunvisor Lab. Ext JS 別館

コメントは停止中です。