1.在專案根目錄下建立 component資料夾 新建vue檔案 goDetail.vue 如下 接收一個 list 和一個 index

<template name="godetail">
	<view @click="handleClick">
		<slot>

		</slot>
	</view>
</template>
<script>
	export default {
		name: "godetail",
		//屬性
		props: {
			list: Array,
			index: Number,
		},
		//元件生命週期
		created: function(e) {
			console.log("建立了元件");
		},
		mounted() {
			// console.log("元件載入完成");
			// console.log(this.list);
			// console.log(this.index);
		},
		methods: {
			tonext: function(obj) {

			},
			handleClick: function(obj) {
				console.log("點選了");
				// 1.資料快取
				getApp().globalData.imglist = this.list;
				getApp().globalData.index = this.index;

				//2.跳轉頁面
				console.log(this.item);
				uni.navigateTo({
				　　url: "/pages/product/product_detail",
				})
			},
		}
	}
</script>
<style>

</style>

2.在頁面用使用

先引入元件

<script>
    // 1、引用元件
    import godetail from "../../component/goDetail.vue";
    // import godetail from '@/component/goDetail';
    // 2、註冊元件
    export default {
        components: {
            godetail
        },

然後插入到 view中,包在需要點選的view外層 這裡包在image外面

    <scroll-view class="scroll-view" scroll-y="true" @scroll="scroll">
                    <view class=" scroll-view-item" v-for
 
="(item,index) in product_list" :key="index">
                        <godetail :list="product_list" :index="index">
                            <image :src="item.product_image" mode="aspectFill" @error="imageError"></image>
                            <view> <text>{{item.product_name}}</text></view>
                            <view> <text>￥{{item.display_price}}</text></view>
                        </godetail>
                    </view>
                </scroll-view>

這樣點選之後就會觸發元件裡面的跳轉方法了