关于uniapp使用renderJS中调用父类方法和参数的使用

首先，页面这样下：

javascript 复制代码

<template>
	<view class="model-container">
		<view v-if="isLoading" class="loading-container">
			<text style="color: white;">加载中: {{ loadingProgress }}%</text>

			<progress style="width: 110px;" border-radius="20" :percent="loadingProgress"  color="#007AFF"></progress>
		</view>
		<view id="map" :modelUrl="modelUrl" :modelname="modelname" :change:modelname="renderjs.ModeladdName"
			:change:modelUrl="renderjs.ModeladdUrl" :prop="isHide" :change:prop="renderjs.handleAction"
			@click="callParentMethod">
			<canvas id="webgl" type="webgl" class="model-canvas"></canvas>
		</view>
	</view>
</template>

<script>
	export default {
		name: 'threeModel',
		props: {
			modelUrl: {
				type: [String],
				default: ''
			},
			modelname: {
				type: [String],
				default: ''
			},
			height: {
				type: [Number, String],
				default: '300px'
			},
			parentMethod: {
				type: Function,
				required: true

			}
		},
		data() {
			return {
				isHide: false,
				isLoading: false,
				loadingProgress: 0
			}
		},
		methods: {
			callParentMethod() {
				this.parentMethod()
			},
			changeLoading(isLoading) {
				this.isLoading = isLoading
			},
			changeProgress(loadingProgress) {
				
				console.log(loadingProgress)
				this.loadingProgress = loadingProgress
			}
		},
		onHide() {
			this.isHide = true
		},
		onUnload() {
			this.isHide = true
		}
	}
</script>

<script module="renderjs" lang="renderjs">
	

	export default {
		data() {
			return {


				

			}
		},
		methods: {
			
			
				
		},
		created() {
			
		}



	}
</script>

<style>
	
</style>

1、如果想在renderJS中调用 changeProgress 这个方法，这样写：

javascript 复制代码

this.$ownerInstance.callMethod('changeProgress', Math.round(percentComplete))

2、如果需要在点击这个组件的时候，调用外面的方法：比如这样：

javascript 复制代码

<ThreeModelViewer :parentMethod="showSeting" :modelname="modelname" :modelUrl="modelUrl"
				style="width: 100vw; height: 280px; justify-content: center;display: flex;margin-top: 60px;" />

这是使用这个组件，在这个组件中传递一个方法：showSeting这个方法，在组件内这样写：

javascript 复制代码

<view id="map"  @click="callParentMethod">

还需要再组件的属性中，添加接收父类的函数属性：

javascript 复制代码

props: {
			
			parentMethod: {
				type: Function,
				required: true

			}
		},

然后再方法中这样写：

javascript 复制代码

methods: {
			callParentMethod() {
				this.parentMethod()
			}
			
		},

这样就可以调用到父类的方法了

3、如果在组件内，想要调用renderJS中的方法，这样写：

javascript 复制代码

:change:modelUrl="renderjs.ModeladdUrl"

根据属性的变化，而调用对应的方法，即可

这就是整个使用了