中文教程

作为开发人员，你必须知道一致的UI内容设计的重要性。在当今世界，保持一致的UI设计是至关重要的，在这个世界上，所有其他企业都有在线业务。这种需要是因为UI组件设计会让你的用户和客户迷失方向、沮丧和困惑。假设你有一个不同按钮风格、菜单和颜色的网站。这是失去用户参与度和客户的最快方式。

在这篇博客中，我们将专注于实现一致格式化的用户界面组件。如果你是一个用户界面设计师，你不应该错过阅读本指南直到最后。我们还将探索一致的用户界面如何帮助我们获得更高的满意度。所以，让我们开始实现最佳UI组件设计的旅程。读完这篇文章。

问：哪个JavaScript框架用于Web开发？
答：一些用于Web开发的最佳JavaScript框架和JavaScript库包括Ext JS，React，Angular和Vue，它们提供定制和可重用的元素。

如果你厌倦了花费无数时间从头开始设计和设计 Web 应用程序，或者发现维护 UI 的一致性和可扩展性具有挑战性，并且您点头同意，那么 UI 组件库就是您的最终解决方案。在本文中，我们将探讨使用 UI 组件库来设计 Web 应用程序样式的 7 个令人信服的理由。

什么是 UI 库？

前言

这个教程的目的在于讲解构成这两个架构的组件的基础知识。

什么是 MVC？

View 和 Model 之间通常没有直接联系，因为控制器指导着两者的更新。通常来说，在 MVC 架构中 Controller 包含了大部分的应用程序逻辑，而 View 几乎没有什么业务逻辑。 Model 则主要是数据的接口，包含着用于管理数据变化的业务逻辑。

MVC 的目标是清晰地定义应用中每个类的职能，使它们能够有效地解耦，为应用程序的测试和维护提供便利，并提高代码的复用性。

因为要使用表单实现跨域上传文件，但是发现在6.7居然不行，需要自己手动去创建FormData对象来提交，这比较奇怪。经过分析源代码，终于找到了这个bug，主要代码如下：

刚刚把 VSCode 升级到了 1.31.0，结果 Sencha 扩展 不能用了，打开项目时，左下角没有了下图的Ext JS: xx% indexed

打开 VSCode 的开发人员工具（帮助-切换开发人员工具），发现如下错误：

今天在帮一个兄弟检查一段自定义控件的代码时觉得他对xtype以及alias的使用和ExtJS各示例代码的使用有较多的不一致，而我自己也不是很清楚使用这两个属性时的最佳方法。因此在回家后整理出了这样一篇文档。一方面用来标准化我们自己的代码，另一方面也共享给大家，毕竟对这两个属性进行详细讨论的资料几乎没有。

xtype

　　首先来看看xtype的定义。在ExtJS的官方文档中是这样对它进行定义的：

　　This property provides a shorter alternative to creating objects than using a full class name. Using xtype is the most common way to define component instances, especially in a container.

　　也就是说，在定义一个类的时候，如果我们指定了它的xtype，那么我们就可以通过这个xtype，而不是类型的全名来创建这些类型。例如对于下面的布局声明：

简介
Sencha Ext JS 6.6已经支持NPM包和开放工具。Ext JS 6.6现在可以通过NPM包让开发人员使用已经相当熟悉的异常简单的工作流。现在，Ext JS开发人员可以是强大的开放式工具来快速生成、构建和更新Ext JS应用程序。Ext JS 6.6还带来了一些主要的增强，如新的现代工具包组件、新的美丽的可访问主题、现代工具包本地化、高级路由和几个Ext JS组件和框架的增强。

Ext JS 6.6 的亮点
Ext JS 6.6通过NPM和开放工具从根本上改变了Ext JS应用程序的生成和创建。此版本中的新功能包括:

Ext JS的NPM包：Ext JS标准和白金用户现在可以直接从Sencha的NPM存储库获取组件、主题和框架的NPM包。

ExtGen：新的开放工具，可以让你通过回答问题的方式来生成新的Ext JS应用程序，并提供了几个新的应用程序模版。

ExtBuild：新的开放工具，用来生成和分发应用程序

新的现代工具包组件：基于材料设计规范的时间字段以及时间面板组件以提供时间视图。

新的美丽的石墨主题可以让可访问性应用程序令人大吃一惊。

增强了对现代工具包的本地化支持。

高级Ext JS路由功能的增强。

增强了仪表组件，并提高了显示间隔值的能力。

当你要创建一个网页时， 经常会发现，你知道怎样用原生的html来创建，却不知道如何使用浩如烟海的ext组件来实现。本文将介绍一些使用ext组件创建html的一些技巧。

接着前面两节， 我们来开始第三节

事件 Events
让我们给组件添加一个click事件。下面这个例子是添加事件的基本方式，很容易理解：