What's new with Ext JS 6?

Toolkits

The biggest change in Ext JS 6 is the consolidation of Ext JS and Touch into a single framework. T he core of the previous framework (data, controllers, models, etc.) has been reconciled into a single public platform. In this way, data and logic can be shared, helping developers further optimize their utilization programs.

Things with unique features will be broken down into two completely different toolkits: Classic and Modern. T hese toolkits are divided through the view layers of Ext JS and Touch. Those who share core resources and logic and use both toolkits are referred to as Universal utilization programs.

When using Cmd to build a utilization program, you need to choose a toolkit that leverages the program, which can be implemented by simply adjusting the app.json that leverages the program, as follows:

publish

Because the framework is combined into a single entity, the structure of the SDK cannot be reorganized without the three regions of classic, modern, and common.

Similarly, the build and sample folders include two subdirectories, classic and modern:

ext-all.js This file still exists in the build folder. E xt-modern .js is equivalent to using sencha-touch .js. The two use a common core.

In the current version, the example kitchensink is a so-called universal utilization program, a single utility that combines both classic and modern build configurations.

The name of the package

The prefixes "ext-" and "sencha-" have been removed from various packages. T hese prefixes were originally used primarily to distinguish between Sencha Touch, Ext JS, and public libraries. N ow they don't need to make this kind of identification anymore, and all of this code is included in Ext JS. This means that "sencha-charts" should now be "charts" and "ext-theme-neptune" is "theme-neptune".

As you might expect, to upgrade from Ext JS 5 to Ext JS 6, you'll need to adjust the name of the package in the app.json file.

Fashion

Fashion is Sencha's new SASS compiler for creating take advantage of program themes. I t is written using Javascript and can run in a reader. W hen combined with PhantomJS, it's better to use Fashion in Sencha Cmd to create SASS than app watch. T his means Ruby is no longer what the system needs! B ecause Fashion is running on a reader, it reduces the build of SASS to two (one for slicer and one for minimizing what is needed). What's more, the app watch can quickly and incrementally rebuild SASS, which brings tangible benefits to developers.

For app watches, there's one bigger benefit to using Fashion: update online! O pen a (modern) reader with a program and load the SASS file instead of the generated CSS. Fashion doesn't have to refresh the page to change and compile SASS and update CSS.

If you want to enable updates in Xi'an, you can add "?platformTags-fashion:true" to the URL.

Compass features that rely on Ruby code will no longer be available because Ruby is no longer used. T his cannot be created without javaScript. W e'll write a custom JavaScript-expanded document as soon as possible. S ome SASS code in Compass has been migrated to Fashion, so not all Compass features are actually exploited. In general, you won't realize the difference if you don't use custom Compass features.

Importantly, online updates only work when the page view is running on Cmd Web server. I n Ext JS's classic toolkit, some Sass modifications may require a layout or full page reload. For the modern toolkit, this problem is rare because it is largely CSS-based and more adaptable to positive changes.

chart

The biggest change in the chart package is in the 3D pie chart, which now supports labeling and configurable 3D aspects. You can see these examples in the chart kitchensink.

ItemEdit plug-in

Another of the biggest and most recent features is the itemEdit plug-in, which runs users to modify chart values by dragging markers. You can view the actions of the siteEdit plug-in by looking at an example of a custom icon for The Chart in Kitchen Sink.

The renderer of sequence labels, barcodes, and prompt information now supports naming (declarative rendering) through ViewController's method. The renderer of the axis label is also coming.

It is important to note that Ext JS 6 has discarded the old ext-charts package. Anyone using ext-charts needs to refactor the exploit to use the sencha-charts package.

grid
spreadsheet

The spreadsheet model introduced in Ext JS 5.1 now has some amazing new features. The selection can now be set to expand by setting extensible to true, so that you can drag the drag angle in the lower right corner to add a selection to expand the current selection vertically or horizontally.

This usually uses a combination of the plug-ins you currently select to copy values to the expanded area, just as you would expect in a typical spreadsheet.

Actionable Mode and accessibility

The grid also supports ARIA's "operational mode", which is an extension of the original cell editing mode. T his allows all types of cell content to get focus or activation via the keyboard. This is a huge advance in accessibility, which allows superusers to navigate anywhere in the grid without a mouse.

LazyItems plug-in

The plug-in delays the rendering of subcompits until they appear, thereby reducing the fulfillment of the instantiation and initialization of the subcompilities.

For example, if you set the seedRender to true in the label panel, the unexplored label does not instantiate and initialize its offspring components, reducing the deactivation and rendering until the label is activated.

Screen browser support (accessibility)

The ARIA functionality has gone directly to the life cycle of the component, which means that the aria package is no longer required to get the correct ARIA action. The program now supports screen browsers (similar to JAWS) without specifying an app.

Microloader

Sencha Cmd 6 now includes a local storage cache in terms of resources, similar to the microloading of Sencha Touch products. Nevertheless, there are some important improvements:

Caching can be disabled in app.json

Only content loaded by microloading will not be deleted

Only the current version of the program can be maintained locally

These improvements address the reported problem with the current Touch microload. P rimarily, it actively deletes locally stored content when it goes beyond space. This problem often arises because old versions of the program are saved that are not necessary, making complete deletion a final choice.

Touch grid

The Touch grid is no longer a stand-alone Cmd package, it is now acquiesced as part of the modern toolkit.

ES6's knowledge points are still waiting for you to learn:

• ES6 Chinese tutorial
• ES6 micro-class
• ES6 from getting started to mastering