Ember.JS: Ember-Objects和它们被导出到的位置

Ember.JS: Ember-Objects and where they are exported to

本文关键字：位置 JS Ember-Objects Ember      更新时间：2023-09-26

我正在尝试掌握Ember.JS的底层系统。这些Ember-Objects 导出到哪里，它们是如何使用的?

<

组件/em>: 

export default Ember.Component.extend({ ... });
<

控制器/em>: 

export default Ember.Controller.extend({ ... });

: 

export default DS.Model.extend({ ... });
<

路线/em>: 

export default Ember.Route.extend({ ... });

…它们都遵循相同的结构:它们扩展某个对象并导出某个对象。

有人知道更多吗?谢谢!

我认为你对export关键字的理解是错误的。

这并不意味着文件在其他地方以不同的格式写入，但是:

如果一个模块(= file)是import ed的，那么该文件中export ed的内容对于导入器是可用的。

可以把它看作是使某些部分对其他模块可用，简单来说就是一个公共API。

烬文件通常只导出一个东西，因为有一个强大的命名约定使烬引擎工作的方式。
这就是为什么如果您声明一个/user路由，它将尝试使用您的routes/user.js、controllers/user.js和templates/user.hbs文件(如果它们存在的话)，而不必指定任何内容。同样，这也是组件在模板中可用的原因。

因此您可以在这些文件中找到一行export default Ember.Something.extend({ ... });。

但是，您可以在单个文件中使用包含多个export语句的模块(= files)，这是完全有效的。

// Example from babel website
// lib/mathplusplus.js
export * from "lib/math";
export var e = 2.71828182846;
export default function(x) {
    return Math.exp(x);
}
// app.js
import exp, {pi, e} from "lib/mathplusplus";
console.log("e^π = " + exp(pi));

Learn ES2015 from Babel网站有一些例子，你可以在MDN上阅读更多关于export声明的内容。

在Ember应用程序中，根据我的经验，您将发现具有多个导出的文件主要位于某些目录中，这些目录意味着应用程序中的多个模块可以使用，或者没有绑定到Ember引擎的自动导入，如某些实用程序。

下面的示例显示了Ember.Controller导入从另一个模块导出的变量:

// utils/messages.js
export var hello = 'Hello!';
export var bye = 'Good Bye!'
// controllers/hello.js
import { hello } from "utils/messages";
export default Ember.Controller.extend({
  firstName: 'David',
  helloString: Ember.computed('firstName', function(){
    return `${hello} ${this.get('firstName')}`;
  })
});
相关文章：