1.0.1 • Published 3 years ago

iframe-msg v1.0.1

Weekly downloads
2
License
MIT
Repository
github
Last release
3 years ago

introduction

让 iframe 父子通信更 easy

  • 不用被 parent、contentWindow 等概念困扰
  • 支持 Promise
  • 支持 Typescript

usage

import { setDefaultSon, setMsgHandler, sendSon, sendDad } from "iframe-msg";

向子 window 发送信息

向子 iframe 发送信息

// 简单发送
sendSon({ name: "wyf", sex: "male" }, "#id");

// 发送后监听响应
sendSon("hello", "#id").then((resp) => {
  console.log("对端响应信息:", resp);
});

向父 window 发送信息

// 简单发送
sendDad([1, 2, 3, 4]);

// 发送后监听响应
sendDad(666).then((res) => {
  console.log(res);
});

监听接受到的信息并回复

setMsgHandler((data, cb) => {
  console.log("父或子iframe发来了信息是:", data);
  cb("收到啦");
});

该监听不区分是来是 父级 还是 子级 的 frame,业务上可以自行区分

更多用法

sendSon 的第二个参数为需要发送的子 iframe,例如可能有多个 iframe,支持 3 中选择器

  • '#id'
  • '.class'
  • name

也可以直接传入 iframe 的 DOM 节点。

另外,可以设置默认子 iframe,这样就不必每次都写了子 iframe 了

setDefaultSon("#id");
sendSon("你好");
sendSon("我很开心");