postMessage API
框架有一个内置的 postMessage API,在另一个窗口内的演示文稿进行通信时可以使用。以下是一个示例,展示了如何在给定的窗口中让一个 reveal.js 实例跳转到幻灯片 2
<window>.postMessage( JSON.stringify({ method: 'slide', args: [ 2 ] }), '*' );
postMessage 事件
当 reveal.js 在 iframe 内部运行时,可以选择将它的所有事件发送到父项。发送的事件是带有三个字段的 JSON 字符串:命名空间、事件名称和状态。以下是如何在父窗口中订阅它们
window.addEventListener('message', (event) => {
var data = JSON.parse(event.data);
if (data.namespace === 'reveal' && data.eventName === 'slidechanged') {
// Slide changed, see data.state for slide number
}
});
postMessage 回调
当你通过 postMessage API 触发任何方法时,reveal.js 会发送一个带返回值的消息。这样做的目的是让你能够调用一个 getter 方法,并查看返回值。查看以下示例
<revealWindow>.postMessage( JSON.stringify({ method: 'getTotalSlides' }), '*' );
window.addEventListener( 'message', event => {
var data = JSON.parse( event.data );
// `data.method`` is the method that we invoked
if( data.namespace === 'reveal' && data.eventName === 'callback' && data.method === 'getTotalSlides' ) {
data.result // = the total number of slides
}
} );
开启/关闭 postMessage
可以通过配置标志来开关跨窗口传递信息的功能。以下是默认值。
Reveal.initialize({
// Exposes the reveal.js API through window.postMessage
postMessage: true,
// Dispatches all reveal.js events to the parent window through postMessage
postMessageEvents: false
});