微信小程序、提示组件、用于解释提示

Component({ externalClasses: ['i-class'], options: { multipleSlots: true }, properties: { //info, success, warning, error type: { type: String, value: 'info' }, closable: { type: Boolean, value: false }, showIcon: { type: Boolean, default: false }, desc: { type: Boolean, default: false }, top: { type: Number, default: 0 } }, data: { closed: true, interval: null, //tips计时器 // duration:5,//计时时间 }, methods: { handleTap() { this.setData({ closed: !this.data.closed, }); this.triggerEvent('close'); }, closeTips:function(){ this.setData({ closed: true, }); }, showTips(event, title, content) { this.setData({ top: event.currentTarget.offsetTop, closed: false, }); let query = this.createSelectorQuery(); query.select('#mytips').boundingClientRect() query.exec((res) => { console.log(res) // 计算容器高度 let tabTargetPosition = event.detail.y; let tabTargetPositionLet = event.detail.x; let containerHeight = res[0].height; let containerWidth = res[0].width; let additionalX = 20; let additionaly = 20; let showTop = tabTargetPosition - containerHeight - additionalX; let showLeft = tabTargetPositionLet - containerWidth - additionaly; console.log(event); console.log(tabTargetPosition, containerHeight); this.setData({ top: showTop, left: showLeft, }); }); }, closeTips(obj) { this.setData({ interval: null, closed: true }); }, } });