浮动按钮

components/Yl_FloatingButton/index.js

@@ -1,35 +1,39 @@
 Component({
-  properties: {
-    radius: Number, //半径 单位px
-    useSlot: Boolean
-  },
-  data: {
-    top: "550px",
-    left: "345px",
-    viewHeight: null
-  },
-  lifetimes: {
-    attached: function () {
-      let that = this;
-      wx.getSystemInfo({
-        success: (res => that.setData({
-          viewHeight: res.windowHeight
-        }))
-      });
-    },
-  },
-  methods: {
-    viewTouchMove(e) {
-      let left = e.touches[0].pageX;
-      if (left > (375 - this.data.radius)) left = 375 - (this.data.radius / 2);
-      if (left < 0 + this.data.radius) left = 0 + this.data.radius;
-      let top = e.touches[0].pageY;
-      if (top < 0 + this.data.radius) top = 0 + this.data.radius;
-      if (top > this.data.viewHeight - this.data.radius) top = this.data.viewHeight - this.data.radius;
-      this.setData({
-        left: left + 'px',
-        top: top + 'px'
-      })
-    }
-  }
+	properties: {
+		radius: Number, //半径 单位px
+		useSlot: Boolean,
+		zIndex: {
+			type: Number,
+			value: 99
+		}
+	},
+	data: {
+		top: "550px",
+		left: "345px",
+		viewHeight: null
+	},
+	lifetimes: {
+		attached: function () {
+			let that = this;
+			wx.getSystemInfo({
+				success: (res => that.setData({
+					viewHeight: res.windowHeight
+				}))
+			});
+		},
+	},
+	methods: {
+		viewTouchMove(e) {
+			let left = e.touches[0].pageX;
+			if (left > (375 - this.data.radius)) left = 375 - (this.data.radius / 2);
+			if (left < 0 + this.data.radius) left = 0 + this.data.radius;
+			let top = e.touches[0].pageY;
+			if (top < 0 + this.data.radius) top = 0 + this.data.radius;
+			if (top > this.data.viewHeight - this.data.radius) top = this.data.viewHeight - this.data.radius;
+			this.setData({
+				left: left + 'px',
+				top: top + 'px'
+			})
+		}
+	}
 })

components/Yl_FloatingButton/index.scss

@@ -1,4 +1,3 @@
 .float-box{
     position: absolute;
-    z-index: 99;
 }

components/Yl_FloatingButton/index.wxml

@@ -1,4 +1,4 @@
-<view class="float-box" style="top: {{top}}; left: {{left}};" bindtouchmove="viewTouchMove">
+<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="新建线索" />
 </view>