需要.js和可重用的 UI 函数

Require.js and reusable UI functions

本文关键字：UI 函数 js 需要      更新时间：2023-09-26

我正在处理一个使用 Require.js 编写的项目。当前正在从全局范围调用许多重用函数。这些功能涉及 UI 转换、隐藏/显示和悬停事件上的常规。我想将这些功能组织到require中，但不太确定在哪里/如何包含它们。

例如，假设在应用程序中有多个点可以调用showDropdown()的通用函数。假设它需要jQuery来制作动画。存储showDropdown功能的最佳位置或方式在哪里？

说一个简单的函数，比如：

function showDropdown(id) {
    var thisdropdown = $(id).find('.dropdown');
    $(thisdropdown).slideDown();
}

我可以创建一个 UI 文件夹，不同的 js 函数都是它们自己的文件。然后只需在依赖于它们的任何其他文件上要求它们。但无论如何，这些文件需要将其功能导出到全局范围才能访问，对吗？

我觉得有一个明显的答案/设置，因为这必须是相当常见的项目。

此外，我正在一个骨干应用程序中编写这篇文章，但我认为这没有任何直接影响，更多的是需要.js问题。

创建一个util库或类似的东西：

// util.js
define({
    showDropdown: function(id) {
        var thisdropdown = $(id).find('.dropdown');
        thisdropdown.slideDown();
    }    
});

然后在其他地方使用它：

require(['util'], function(util) {
    util.showDropdown('my-id');
});
相关文章：