1.3.20 • Published 6 years ago

@beisen/ux-reward v1.3.20

Weekly downloads
1
License
MIT
Repository
-
Last release
6 years ago

接入方法

import UxReward from '@beisen/ux-reward'

1. 实例化

let myReward = new UxReward({
    needMask: false,
    zIndex: 111, //层级
    onClose: function() {
        //关闭的回调
    },
    onSuccess:function(res){
        //打赏成功的回掉函数
    },
    domNode: document.getElementById("dom-node"), //组件的挂载点
    loginUser: {
        //当前登陆账号的信息
        name: "neo",
        avatar: {
            hasAvatar: true,
            img: "//www.xxx.png",
            color: null
        },
        id: "110"
    }
});

2. 唤醒打赏

myReward.renderPayReward({
    toUserInfo: {
        //被打赏人信息
        name: "neove",
        avatar: {
            hasAvatar: true,
            img: "//www.xxx.png",
            color: null
        },
        id: "201034665"
    },
    objId: "245347_6329187_7_20_636233703629436521",
    objType: 7
});

3. 唤醒收赏

myReward.renderReceiveReward({
    data:{},
    needMask:true,
    onOpen:function(a){}//成功拆开红包的回调,参数a就是传进去的data
});

4. 关闭组件

myReward.unMount();

问题:

  • 标题名字超出打点
  • 输入错误的提示语
  • 切换自定义打赏的位置
  • 微信支付界面:加字:共多少元
  • 发分享的控件:表情 @ 人 附件 优先级低
  • 发分享时候生成的图片
  • 开红包的问题:打开的回调
  • 打赏成功后的页面问题:宿主提供一个预览的地址,然后提供给打赏组件 规则?

总结:

  • css 动画停止的检测方案
  • rotate 旋转的问题
  • react 阻止事件的冒泡 在不需要触发关闭的点击事件上组织冒泡
e.stopPropagation();
e.nativeEvent.stopImmediatePropagation();
  • input placeHolder style
::-webkit-input-placeholder {
    font-size: 20px;
    color: #c3cbd1;
}
::-moz-placeholder {
    font-size: 20px;
    color: #c3cbd1;
}
:-ms-input-placeholder {
    font-size: 20px;
    color: #c3cbd1;
}
:-moz-placeholder {
    font-size: 20px;
    color: #c3cbd1;
}
  • input number remove arrow
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
    margin: 0;
}