**PageOffice版本：V6.7.0.1版本**

- [查看本示例演示效果（Windows版）](https://www.bilibili.com/video/BV1M34y1A7qL?p=6)
- [查看本示例演示效果（国产版）](https://www.bilibili.com/video/BV1eM4m167Lc?p=6)

POBrowser内置的JS函数CallParentFunc用于PageOffice浏览器打开的页面（子页面）回调父页面JS函数，此功能有如下用途：
- 可以实现子页面调用父页面的JS函数；
- 可以实现子页面给父页面传参；
- 可以实现子页面更新父页面的局部状态信息；
- 可以实现子页面刷新整个父页面等功能。

CallParentFunc回调函数原型：
```
// FuncName：自定以函数名。此函数有且只能有一个字符串参数。
// paramJson：json字符串，用于回调时传递参数。
function FuncName(paramJson){
	// 此处编写您的js代码

	return '';// 返回值必须是字符串类型
}
```

### 前端代码

例如：调用openWindow的页面（父页面）有一个计数器，每次点击子页面中的按钮都回调父页面函数使得这个计数器的值+1。
1. 父页面代码。

首先，在页面添加一个input用来展示数据；
```
<div>Count=<input v-model="CountValue" /></div>
```
然后，定义一个updateCount函数增加计数；
```
// 定义给子页面回调的函数
updateCount(paramJson) {
	let pJson = JSON.parse(paramJson);
	let num = pJson.num;//获取到参数 num
	let count = parseInt(this.CountValue);
	this.CountValue = count + num;
	return this.CountValue.toString();
}
```
1. 将当前页面中定义的updateCount函数挂载到window对象上。
	- 如果是vue项目需要执行下面的代码，：
	```
	mounted: function () {
	    window.POPageMounted = this;
	}
	```
	- 如果是vue3项目需要执行下面的代码：
	```
	onMounted(() => {
	    window.POPageMounted = { updateCount };
	});
	```
2. 接着上述步骤，子页面（POBrowser打开的页面）按钮点击时，通过执行下面的increaseCount函数回调父页面的updateCount函数。

```
increaseCount(value) {
	let pJson = {}; // 使用json对象传递参数
	pJson.num = value; //传递参数 num
	let pstr = JSON.stringify(pJson);

	window.CallParentFunc({
		funcName: 'updateCount', //回调父页面的函数名
		paramJson: pstr, //传递参数
		success: function (strRet) { //回调成功，获取回调函数的返回值
			alert("现在父窗口Count的值为：" + strRet);
		},
		error: function (strErr) {
			if(strErr.indexOf('parentlost')>-1){
				alert('父页面关闭或跳转刷新了，导致父页面函数没有调用成功！');
				return;
			}
		}
	});
}
```
参考链接：[POBrowser回调父页面的函数传值 | PageOffice 开发者中心](https://pageoffice.cn/pages/3842ec/)

POBrowser内置的JS函数CallParentFunc用于PageOffice浏览器打开的页面（子页面）回调父页面JS函数，此功能有如下用途：

PageOfficeV6.7.0.1回调父页面的函数传值

编程语言

PageOffice V6.7.0.1中POBrowser内置JS函数CallParentFunc，实现子页面回调父页面JS函数、传参及更新父页面状态。通过JSON传递参数，支持Vue2/Vue3项目挂载，示例展示计数器回调更新操作，提升页面交互效率。

代码解释

Windows

JSON

文章

问答

视频

教程

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云智能顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

EdgeOne AI 安全实战专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

聚焦“写作效率、视觉美观与运行性能”三方面进行全面升级，为您提供更高效、稳定的创作环境

社区富文本&Markdown编辑器全新改版上线，欢迎大家体验!

诚挚邀请您参与本次调研，分享您的真实使用感受与建议。您的反馈至关重要，感谢您的支持与参与！

社区新版编辑器体验调研

PageOfficeV6.7.0.1回调父页面的函数传值-腾讯云开发者社区-腾讯云

PageOfficeV6.7.0.1回调父页面的函数传值

PageOfficeV6.7.0.1回调父页面的函数传值

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐