更新记录

1.0.3（2023-05-11）

更新组件bug

1.0.2（2023-05-11）

插槽修改1.0.2

1.0.1（2023-05-11）

添加插槽，可自定义物流卡片内容，物流流程内容

平台兼容性

说明

插件依赖scss

参数

插槽

代码示例

<template>
    <view>
        <view class="flex">
            <button @click="show = 1">默认显示</button>
            <button @click="show = 2">主题色修改</button>
            <button @click="show = 'slot'">自定义插槽</button>
        </view>
        <lee-logistics v-if="show == 1" :list="dataList"></lee-logistics>
        <lee-logistics v-if="show == 'slot'" :list="dataList">
            <!-- 卡片插槽 -->
            <template v-slot:card="{row}">
                <view class="">
                    <view>自定义流程内容</view>
                    <view class="">物流公司:{{row.type}}</view>
                </view>
            </template>
            <!-- 流程插槽 -->
            <template v-slot:process="{row}">
                <view class="">
                    <view>自定义流程内容</view>
                    <view>时间：{{row.time}}</view>
                </view>
            </template>
        </lee-logistics>
        <lee-logistics v-if="show == 2" :list="dataList" color="#00aaff"></lee-logistics>
    </view>
</template>

<script>
    import leeLogistics from '../../components/logistics/logistics.vue'
    export default {
        components:{leeLogistics},
        data() {
            return {
                show:'slot',
                dataList:[
                    {
                        status:'已签收',
                        content:'快递员 小陈已将物品配送到目的地 请尽快签收 有问题请联系18888559999',
                        time:'2023-05-01 06:20:28'
                    },
                    {
                        content:'[厦门市] 快递到达胜利路胜利街199号',
                        time:'2023-05-01 03:10:12'
                    },
                    {
                        content:'[广州市] 快递到达望海镇九五大街转运中心',
                        time:'2023-04-29 22:45:28'
                    },
                    {
                        status:'正在揽件',
                        content:'包裹正在揽收，快递小哥正在快马加鞭的赶来~',
                        time:'2023-04-29 14:18:39'
                    },
                    {
                        status:'已接单',
                        content:'包裹正在打包中~',
                        time:'2023-04-28 18:50:26'
                    }

                ]
            }
        },
        methods: {

        }
    }
</script>

<style>
page{
    background: #eee;
}
.flex{
    display: flex;
    padding: 20rpx 0;
}
</style>