Question

我有一个Chrome扩展程序，它使用上下文菜单项来触发一个功能。此菜单仅在用户右键单击指向某种文件类型的链接时显示。现在我的问题是我需要将链接的URL传递给函数。在"onclick"中的chrome.contextMenus.create()参数中，我尝试将各种参数添加到回调函数中。我在回调中尝试使用以下内容：

function(linkUrl) { onClickHandler(linkUrl); }
function({"info":["linkUrl"]}) { onClickHandler(linkUrl); }
function("info":["linkUrl"]) { onClickHandler(linkUrl); }
function() { onClicHandler(linkUrl); }
function({"info":["linkUrl"]}) { onClickHandler({"info":["linkUrl"]}); }
function() { onClickHandler({"info":["linkUrl"]}); }

我也尝试过使用chrome.contextMenus.onClicked.addListener(onClickHandler(linkUrl));和chrome.contextMenus.onClicked.addListener(onClickHandler({"info":["linkUrl"]});但没有成功。它始终返回null，undefined和[object Object]。如何传递链接的URL？ API文档并没有详细说明。

Answer 1

哇，这太乱了。

您需要传递对该函数的引用以将其用作回调。代替..

// defines a function that takes 1 parameter and passes it to the handler
function(linkUrl) { onClickHandler(linkUrl); }
// syntax error - you  can only specify a parameter name
function({"info":["linkUrl"]}) { onClickHandler(linkUrl); }
// syntax error
function("info":["linkUrl"]) { onClickHandler(linkUrl); }
// linkUrl does not come from anywhere
function() { onClicHandler(linkUrl); }
// syntax error
function({"info":["linkUrl"]}) { onClickHandler({"info":["linkUrl"]}); }
// Passes a constant object {"info": ["linkUrl"]} to the handler
function() { onClickHandler({"info":["linkUrl"]}); }

// Passes the result of executing onClickHandler(linkUrl) as a function
//  (Which probably does not return a function, and linkUrl is undefined)
chrome.contextMenus.onClicked.addListener(onClickHandler(linkUrl));

// Passes the result of executing onClickHandler(obj) as a function
//  where obj is that constant object {"info": ["linkUrl"]}
chrome.contextMenus.onClicked.addListener(onClickHandler({"info":["linkUrl"]});

Shotgun debugging多少？

你的第一次尝试最接近工作。但你必须明白会发生什么。我们举个例子吧。假设您有一个API，它异步返回一个非常特定形式的对象：

function myAwesomeAPICall(callback) {
  /* ... */
  callback({apples: n, oranges: m});
}

它期望一个函数将接收该特定类型的对象并对其执行某些操作。比如说，你有一个

形式的处理程序

function applesAndOranges(numApples, numOranges) {
  /* ... */
}

预计会有2个号码。所以你不能这样做：

myAwesomeAPICall(applesAndOranges);

从那时起numApples将成为一个对象，而numOranges将是未定义的。您可以根据需要为参数命名，但myAwesomeAPICall的结构不知道您的定义：它只是将它想要的内容放在第一个参数上。

因此，您需要一个接受对象的函数，并将数字提供给您的处理程序。

function callbackForAPI(obj) { // obj will have the required format
  applesAndOranges(obj.apples, obj.oranges);
}

myAwesomeAPICall(callbackForAPI);
// Note, it's not callbackForAPI() - that would be passing the result,
//  not the function itself

实际上，它根本不必是命名函数。匿名函数可以正常运行：

myAwesomeAPICall(function(obj) {
  applesAndOranges(obj.apples, obj.oranges);
});

获得的经验：API期望使用特定格式的回调进行回调。

事实上，the docs这样说：

chrome.contextMenus.onClicked.addListener(function callback)
回调参数应该是一个如下所示的函数： function（object info，tabs.Tab tab）{...}; （对象info的描述如下）

请注意“应该”。虽然您不需要使用传递的参数，但您可以只使用info，或者不使用任何内容，但数据的预期格式如上所述。

所以，最后：

chrome.contextMenus.onClicked.addListener(function(obj, tab) {
  onClickHandler(obj.linkUrl);
});

使用Chrome扩展程序上下文菜单将链接的网址传递给回调函数

1 个答案: