刷新附加组件 SDK 中的内容网址

refresh contenturl in add-on sdk

本文关键字：组件 SDK 刷新      更新时间：2023-09-26

当我单击小部件图标时，如何使用内容网址刷新面板？ 我的代码在这里很简单，它是：

    var data = require("sdk/self").data;
exports.main = function() {
    var panel = require("sdk/panel").Panel({
        width: 400,
        height: 560, 
        contentURL: "http://sample.com/index.html",      
    });
    panel.on("show", function() {
      panel.port.emit("show");
    });
    require("sdk/widget").Widget({
        id: "Sample",
        label: "Sample",
        contentURL: data.url("icon128.png"),
        panel:panel
    });
};

更改面板在小部件上的contentURL单击，如下所示：

require("sdk/widget").Widget({
    id: "Sample",
    label: "Sample",
    contentURL: data.url("icon128.png"),
    panel:panel,
    onClick: function() {
      panel.contentURL = contentURL;
    }
});

请记住以下几点

小部件文档：

从 Firefox 29 开始，小部件 API 已弃用。请参阅 ui 模块进行更换。特别是，对于简单的按钮，请尝试操作按钮或切换按钮 API。

面板文档：

通过将按钮本身作为位置选项传递给面板的 show（） 方法或其构造函数，可以将面板附加到切换按钮：

var { ToggleButton } = require('sdk/ui/button/toggle');
var panels = require("sdk/panel");
var self = require("sdk/self");
var button = ToggleButton({
  id: "my-button",
  label: "my button",
  icon: {
    "16": "./icon-16.png",
    "32": "./icon-32.png",
    "64": "./icon-64.png"
  },
  onChange: handleChange
});
var panel = panels.Panel({
  contentURL: self.data.url("panel.html"),
  onHide: handleHide
});
function handleChange(state) {
  if (state.checked) {
    panel.show({
      position: button
    });
  }
}
function handleHide() {
  button.state('window', {checked: false});
}
相关文章：