更新记录

1.1.0（2024-12-06） 下载此版本

效果优化

1.0.2（2023-11-08） 下载此版本

支持图片预览

1.0.1（2023-11-05） 下载此版本

样式优化

平台兼容性

uni-app

其他

支持扫码体验-见右侧二维码

<template>
    <view>
        <comment-list :detail="detail" @reply="reply" @comment="comment"></comment-list>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                detail: {
                    id: 0,
                    userId: 1,
                    userName: '明月天涯',
                    portrait: 'https://mp-bcaa355d-ec14-4cb2-a10e-482127e7cb48.cdn.bspapp.com/VKCEYUGU-bcaa355d-ec14-4cb2-a10e-482127e7cb48/00412594-656b-4379-a49e-0b381d5f6652.jpg',
                    time: '2023年10月30日 14:20',
                    content: '明月天涯明月天涯明月天涯明月天涯明月天涯明月天涯明月天涯',
                    imageList: [
                        'https://mp-bcaa355d-ec14-4cb2-a10e-482127e7cb48.cdn.bspapp.com/VKCEYUGU-bcaa355d-ec14-4cb2-a10e-482127e7cb48/00412594-656b-4379-a49e-0b381d5f6652.jpg', 
                        'https://mp-bcaa355d-ec14-4cb2-a10e-482127e7cb48.cdn.bspapp.com/VKCEYUGU-bcaa355d-ec14-4cb2-a10e-482127e7cb48/00412594-656b-4379-a49e-0b381d5f6652.jpg', 
                        'https://mp-bcaa355d-ec14-4cb2-a10e-482127e7cb48.cdn.bspapp.com/VKCEYUGU-bcaa355d-ec14-4cb2-a10e-482127e7cb48/00412594-656b-4379-a49e-0b381d5f6652.jpg', 
                        'https://mp-bcaa355d-ec14-4cb2-a10e-482127e7cb48.cdn.bspapp.com/VKCEYUGU-bcaa355d-ec14-4cb2-a10e-482127e7cb48/00412594-656b-4379-a49e-0b381d5f6652.jpg', 
                        'https://mp-bcaa355d-ec14-4cb2-a10e-482127e7cb48.cdn.bspapp.com/VKCEYUGU-bcaa355d-ec14-4cb2-a10e-482127e7cb48/00412594-656b-4379-a49e-0b381d5f6652.jpg',
                        'https://mp-bcaa355d-ec14-4cb2-a10e-482127e7cb48.cdn.bspapp.com/VKCEYUGU-bcaa355d-ec14-4cb2-a10e-482127e7cb48/00412594-656b-4379-a49e-0b381d5f6652.jpg',
                        'https://mp-bcaa355d-ec14-4cb2-a10e-482127e7cb48.cdn.bspapp.com/VKCEYUGU-bcaa355d-ec14-4cb2-a10e-482127e7cb48/00412594-656b-4379-a49e-0b381d5f6652.jpg',
                        'https://mp-bcaa355d-ec14-4cb2-a10e-482127e7cb48.cdn.bspapp.com/VKCEYUGU-bcaa355d-ec14-4cb2-a10e-482127e7cb48/00412594-656b-4379-a49e-0b381d5f6652.jpg',
                        'https://mp-bcaa355d-ec14-4cb2-a10e-482127e7cb48.cdn.bspapp.com/VKCEYUGU-bcaa355d-ec14-4cb2-a10e-482127e7cb48/00412594-656b-4379-a49e-0b381d5f6652.jpg'
                    ],
                    commentList: [{
                        id: 1,
                        userId: 2,
                        userName: '天涯',
                        portrait: 'https://mp-bcaa355d-ec14-4cb2-a10e-482127e7cb48.cdn.bspapp.com/VKCEYUGU-bcaa355d-ec14-4cb2-a10e-482127e7cb48/00412594-656b-4379-a49e-0b381d5f6652.jpg',
                        time: '2023年10月30日 14:20',
                        content: '明月天涯明月天涯明月天涯明月天涯明月天涯明月天涯明月天涯',
                    }, {
                        id: 2,
                        userId: 3,
                        userName: '明月',
                        toUserName: '天涯',
                        portrait: 'https://mp-bcaa355d-ec14-4cb2-a10e-482127e7cb48.cdn.bspapp.com/VKCEYUGU-bcaa355d-ec14-4cb2-a10e-482127e7cb48/00412594-656b-4379-a49e-0b381d5f6652.jpg',
                        time: '2023年10月30日 14:20',
                        content: '明月天涯明月天涯明月天涯明月天涯明月天涯明月天涯明月天涯',
                    }]
                }
            };
        },
        methods: {
            comment() {
                console.log('-评论-')
            },
            reply(item) {
                console.log('-回复-', item)
            },
        }
    }
</script>