解决Error: Not Found：Page[5][-1,81] at view.umd.min.js

二七狂人

已于 2024-07-19 13:39:00 修改

阅读量75

点赞数

文章标签：前端 javascript uniapp vue

于 2024-07-19 12:09:31 首次发布

本文链接：https://blog.csdn.net/weixin_43066287/article/details/140545611

版权

场景说明：

uniapp使用组件，在APP环境出现，在H5环境正常。
单页面上多处使用该组件，使用同名参数设置数据，应用切换效果时，触发请求不同接口，返回数据格式不同。
使用v-if时出现，使用v-show时正常。

原因分析：
尚不明确。

解决方案1：
将组件注册多个不同名称来使用，对应不同的返回数据。

<template>
	<vTabs v-model="active" @change="handelTabs"></vTabs>
	<view v-if="active == 0">
		<vTabs1 :tabs="type1"></vTabs1>
	</view>
	<view v-if="active == 1">
		<vTabs2 :tabs="type1"></vTabs2>
	</view>
</template>
<script>
	import vTabs from "@/components/v-tabs.vue"
	import vTabs1 from "@/components/v-tabs.vue"
	import vTabs2 from "@/components/v-tabs.vue"
	export default {
		computed: mapState([]),
		components: {
			vTabs,
			vTabs1,
			vTabs2
		},
		data() {
			return {
				active: 0,
				type: [],
			}
		},
		methods: {
			handelTabs(index) {
				this.active = index
				if (this.active == 0) {
					this.type = ["a","b","c"]
				}
				if (this.active == 1) {
					this.type = [[{"id":1,"name":"a"},{"id":2,"name":"b"},{"id":3,"name":"c"}]
				}
			}
		}
	}
</script>

解决方案2：
切换判断条件全部使用v-show。

<template>
	<vTabs v-model="active" @change="handelTabs"></vTabs>
	<view v-show="active == 0">
		<vTabs1 :tabs="type1"></vTabs1>
	</view>
	<view v-show="active == 1">
		<vTabs1 :tabs="type1"></vTabs1>
	</view>
</template>
<script>
	import vTabs from "@/components/v-tabs.vue"
	import vTabs1 from "@/components/v-tabs.vue"
	export default {
		computed: mapState([]),
		components: {
			vTabs,
			vTabs1
		},
		data() {
			return {
				active: 0,
				type: [],
			}
		},
		methods: {
			handelTabs(index) {
				this.active = index
				if (this.active == 0) {
					this.type = ["a","b","c"]
				}
				if (this.active == 1) {
					this.type = [[{"id":1,"name":"a"},{"id":2,"name":"b"},{"id":3,"name":"c"}]
				}
			}
		}
	}
</script>