更新记录

1.0.0（2022-11-10）

• v1.0.0 首发

平台兼容性

1.安装方式

本组件符合easycom规范，HBuilderX 2.5.5起，只需将本组件导入项目，在页面template中即可直接使用，无需在页面中import和注册components。

如果是通过下载解压方式，只需将其组件包文件夹放到项目目录components中

2.基本用法

在需要添加的页面中写组件<zs-poster />，按需改变属性即可，需要自己准备三个图片，参考代码如下

<template>
    <view class="content">
        <zs-poster style="width:100%; height: 450px;"
            :imgHead="headImg"
            :imgScan="scanImg"
            :imgBg="bgImg"
            :img-bg-scale="0.6"
            :title="title"
            subtitle="不忘初心, 牢记使命"
            nick="TA远方"
            scan-toast="扫一扫, 关注一下"
            :direction="1"
            ref="zsPoster">
        </zs-poster>
        <view style="text-align: center;margin-top: 20px;">
            <button @click="onSave" type="primary">保存图片</button>
        </view>
    </view>
</template>
<script>
    export default {
        data() {
            return {
                title: '宁静致远',
                headImg: '../../static/see_yuanfang.jpg',
                bgImg: '../../static/compressflag.jpg',
                scanImg: '../../static/my_csdn.png'
            }
        },
        onLoad() {

        },
        methods: {
            onSave(){
                this.$nextTick(()=>{
                    this.$refs.zsPoster.saveImage();
                })
            }
        }
    }
</script>

3.组件特点

4.组件示例

如果有，请使用HBuilderX导入示例，或下载示例项目文件解压运行可查看

5.参与学习

~加入QQ群186736431参与学习交流，欢迎提出需求改进意见！