在vue组件中同时使用普通script标签、renderjs模式的script标签

如下

在这里插入图片描述
**如果想要在renderjs中引用外部文件的方法或者普通js中的方法,不能直接使用
this.xxx() 去获取
,
在h5平台上不会报错,能正常使用。
一旦用Hbuilder去打包成APP,就会出现一些根本找不出来问题在哪的错误:
**

	比如我在公共方法的组件中用到了多语言uni.getLocale(),
	直接在renderjs中引用这个公共组件,总是出现如下报错,
	导致我排查了整个项目都找不出来问题

在这里插入图片描述

说到底,该怎么在renderjs中正确引用外组件的公共方法呢,和引用普通script标签中的方法一致。如下示例

<template>
</template>
<script>
import { getDeviceStatus, statusType } from '@/utils/deviceStatus'
methods: {
	getDeviceStatus,
	statusType,
},
</script>
<script module="olMap" lang="renderjs">
mounted() {
	this.$ownerInstance.callMethod('getDeviceStatus', '要传的参数');
	this.$ownerInstance.callMethod('statusType', '要传的参数');
}
</script>

this.$ownerInstance.callMethod(fun(), ‘要传的参数’);

以上仅仅是renderjs中调用普通script标签中的方法或者是外部引入的方法,那么如果外部引入的方法有返回值,该如何在renderjs中拿到返回值呢,就需要用到如下方法了

<template>
</template>
<script>
import { getDeviceStatus, statusType } from '@/utils/deviceStatus'
methods: {
	getDeviceStatus,
	statusType,
},
</script>
<script module="olMap" lang="renderjs">
mounted() {
	// this.$ownerInstance.$vm.getDeviceStatus(deviceInfo.dclass, deviceInfo.states.status, 'device');
	// this.$ownerInstance.$vm.statusType(deviceInfo.dclass, deviceInfo.states.status, 'device');
	// this.$ownerInstance.$vm之后的fn就是逻辑层中的方法
	this.$ownerInstance.$vm.fn('要传递给逻辑层方法的参数');
}
</script>

我靠了啊,最新验证,无法在renderjs中,直接通过调用普通js中的带有返回值的方法,拿到其返回值。以上所述,当长个记性吧,日了

原因就在于,在renderjs中,this.$ownerInstance.callMethod方法必须通过点击事件才能触发。

没办法,只能是把在renderjs用到的,对数据的处理方法,直接写在renderjs中了。

还不能用子组件引入。只能在当前组件的renderjs中写!!!!!!!!!!

Logo

北京人形旗下天工造物具身智能开源社区,聚焦具身天工与慧思开物两大平台

更多推荐