uniapp微信小程序按钮分享定制动态传参
打印 onShareAppMessage 中的传参(注意:上方我定义了一个open-type为share的按钮)
打印之后如下:
给按钮绑定 data-id 可以在这里的 dataset 中取到
然后根据 from 的值来动态返回分享的参数
示例代码:
<template><view class="container"><view v-for="(item,index) in 2" :key="index" class="item flexRowCenterAll" @click="todo"><view class="left flexColumn"><text class="inf">报价单名称:工商报价单</text><text class="inf">客户:张三</text><text class="inf">创建时间:2024.05.02 13:02:05</text></view><view class="right flexColumnCenterAll"><text style="color: #0581FE;margin-bottom: 16rpx;">已同步客户</text><view class="flexRowCenterAll"><button class="shareBtn" :data-id="1" open-type="share" @click.stop><u-icon name="share-fill" color="#2979ff" size="28"></u-icon></button><u-icon name="list-dot" color="#2979ff" size="28" @click.stop="showMenu"></u-icon></view></view></view></view>
</template><script>export default{onShareAppMessage(res){console.log(res);if(res.from == 'button'){let id = res.target.dataset.idlet name = res.target.dataset.namereturn {path:'',title:``}}},methods:{showMenu(){uni.showActionSheet({itemList:['编辑报价单','同步至客户','删除']})},todo(){console.log('1111');}}}
</script><style lang="scss" scoped>.container{.item{padding: 16rpx;justify-content: space-between;background: white;border-bottom: 1rpx solid #efefef;font-size: 24rpx;.inf{margin-bottom: 16rpx;&:last-child{ margin-bottom: 0; }}.shareBtn{background: transparent;border: none;&::after{border: none;}}}}
</style>