我有一个列表,必须从扩展返回到我的webview页面的输入框。
就像webview中的javascript事件一样,它必须调用列表的扩展,然后使用该列表对象并在视图中显示列表数据。我该怎么做呢?
发布于 2019-07-02 07:17:40
WebView类有一个向WebView内容发送消息的方法和一个从该内容接收消息的事件。请参阅vscode documenation about message passing中的章节。
在您的webview代码中,您可以使用以下命令接收消息:
// Handle the message inside the webview
window.addEventListener('message', event => {
const message = event.data; // The JSON data our extension sent
switch (message.command) {
case 'refactor':
count = Math.ceil(count * 0.5);
counter.textContent = count;
break;
}
});
在扩展代码中,您可以处理来自webview内容的消息,如下所示:
// Handle messages from the webview
panel.webview.onDidReceiveMessage(
message => {
switch (message.command) {
case 'alert':
vscode.window.showErrorMessage(message.text);
return;
}
},
undefined,
context.subscriptions
);
要向扩展发送消息,您必须在webview代码中获取vscode API:
(function() {
const vscode = acquireVsCodeApi();
const counter = document.getElementById('lines-of-code-counter');
let count = 0;
setInterval(() => {
counter.textContent = count++;
// Alert the extension when our cat introduces a bug
if (Math.random() < 0.001 * count) {
vscode.postMessage({
command: 'alert',
text: '? on line ' + count
})
}
}, 100);
}())
最后,从扩展向webview内容发送消息很简单,如下所示:
currentPanel.webview.postMessage({ command: 'refactor' });
https://stackoverflow.com/questions/56830928
复制相似问题