添加如果浮动按钮图片加载失败采用备用样式

components/Yl_FloatingButton/index.js

@@ -14,7 +14,8 @@ Component({
     data: {
         top: "550px",
         left: "345px",
-        viewHeight: null
+        viewHeight: null,
+        alternative:false
     },
     lifetimes: {
         attached: function () {
@@ -38,6 +39,12 @@ Component({
                 left: left + 'px',
                 top: top + 'px'
             })
+        },
+        imageOnErr(e){
+            console.log("图片加载失败")
+            this.setData({
+                alternative:true
+            })
         }
     }
 })

components/Yl_FloatingButton/index.scss

@@ -1,3 +1,24 @@
-.float-box{
+.float-box {
     position: absolute;
+}
+
+.circle-box {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 160rpx;
+    height: 160rpx;
+    transform: translate(-50%, -50%);
+
+    .circle {
+        background-color: #1060E3;
+        width: 130rpx;
+        height: 130rpx;
+        text-align: center;
+        line-height: 120rpx;
+        border-radius: 50%;
+        color: #fff;
+        font-size: 90rpx;
+        box-sizing: border-box;
+    }
 }

components/Yl_FloatingButton/index.wxml

@@ -1,4 +1,9 @@
 <view class="float-box" style="top: {{top}}; left: {{left}}; z-index:{{zIndex}};" bindtouchmove="viewTouchMove">
-  <slot wx:if="{{useSlot}}" />
-  <image wx:else style="width: 160rpx; height: 160rpx; transform: translate(-50%,-50%);" src='../../static/image/add.png' data-title="新建线索" />
+    <slot wx:if="{{useSlot}}" />
+    <image wx:elif='{{!alternative}}' style="width: 160rpx; height: 160rpx; transform: translate(-50%,-50%);" src='../../static/image/add.png' binderror='imageOnErr' data-title="新建线索" />
+    <view wx:else class="circle-box">
+        <view class="circle">
+            +
+        </view>
+    </view>
 </view>