What is Ext.Loader in Ext.js4.2.1
This article mainly introduces what Ext.Loader is in Ext.js4.2.1, it has certain reference value, interested friends can refer to it, I hope you can learn a lot after reading this article, let's take you to know it.
One: description
Ext.Loader is the core of dynamic loading in ExtJs4+. It is generally used through Ext.require (). Ext.Loader supports both synchronous and asynchronous loading.
Two: asynchronous loading
Advantages:
1. Support for cross-domain access
two。 Do not need a Web server, you can run programs such as file://path/to/your/index.html through the file system protocol
3. Easy to debug
Disadvantages:
1. Dependencies must be specified in advance
How to use it:
/ / aliases for a single class
Ext.require ('widget.window')
/ / single class
Ext.require ('Ext.window.Window')
/ / multiple aliases, multiple classes
Ext.require (['widget.window',' layout.border', 'Ext.data.Connection'])
Ext.require (['widget.*',' layout.*', 'Ext.data.*'])
Three: synchronous loading
Advantages:
1.1. You don't need to specify the dependency in advance, you just need to include ext-all.js in advance
Disadvantages:
1. Not easy to debug unless you use Firebug
two。 Cross-domain requests cannot be made because the limit of XHR must be the same domain name
3. Must have a Web server
How to use it: you can follow a simple rule to instantiate objects with Ext.create instead of new keyword
For example: Ext.create ('widget.window', {...}); or Ext.create (' Ext.window.Window', {})
In addition, the mixed loading mode can be used to combine the advantages of synchronous and asynchronous loading.
Four: parameters
1.disableCaching:Boolean
Disable caching of js files. Default is true.
If we set DisableCaching equal to true, we automatically add a parameter with the DisableCachingParam attribute value as the parameter name when sending the request (default is "_ dc" if the DisableCachingParam value is empty), and the value is the current time parameter. This works effectively with the cache.
2.disableCachingParam:String
Cache parameter, default is'_ dc'
3.enabled:Boolean
Whether to enable dynamic loading. Default is false.
Such as:
Ext.Loader.setConfig ({
Enabled: true
Paths: {/ / 'class name prefix': 'path'
'App.ux': 'lib'
}
});
Ext.require (['App.ux.MusicWin']); / /' lib/MusicWin.js' is automatically loaded by matching.
Notice that inside Ext.require is the MusicWin.js file under App.ux.
MusicWin.js Code:
Ext.define ('App.ux.MusicWin', {
Play: function () {
Alert ('playing...')
}
});
4.garbageCollect:Boolean
5.paths:Ojbect
Mapping between files and namespaces
Five: methods
1.addClassPathMappings
ClassName:path mappings is similar to the parameter paths
2.exclude
Its abbreviated form is Ext.exclude.
3.require
Its abbreviated form is Ext.require.
4.onReady (fn,scope,withDomReady)
Add a listener that executes the contents of the listener when all the scripts are loaded.
5.setConfig (config)
Set the parameters for loader, which should be called after ext-*.js is loaded and before Ext.onReady.
Such as: Ext.Loader.setConfig ({
Enabled: true
DisableCaching: true
Paths: {
'Ext.ux.desktop':'.. / desktoplib'
"MyDesktop":'.. / modules'
}
});
Ext.require (...)
Var startup
Ext.onReady (function () {
Startup = Ext.create ("MyDesktop.StartUp")
Startup.loadDesktop ()
});
6.syncRequire (expressions, [fn], [scope], [excludes])
Load the specified classes and their direct dependencies synchronously, and execute the corresponding drop function when the loading is complete.
Alias syncRequire.
Thank you for reading this article carefully. I hope the article "what is Ext.Loader in Ext.js4.2.1" shared by the editor will be helpful to you. At the same time, I also hope you will support us and pay attention to the industry information channel. More related knowledge is waiting for you to learn!
