Merge pull request #1325 from didi/fix-web-api

picker相关组件新增scrollOptions & 修复class name被覆盖
didi · Dec 4, 2023 · 82aa73b · 82aa73b
2 parents ef40678 + 0012a78
commit 82aa73b
Show file tree

Hide file tree

Showing 5 changed files with 34 additions and 10 deletions.
diff --git a/packages/webpack-plugin/lib/platform/template/wx/index.js b/packages/webpack-plugin/lib/platform/template/wx/index.js
@@ -200,12 +200,20 @@ module.exports = function getSpec ({ warn, error }) {
       },
       {
         // 样式类名绑定
-        test: /^wx:(class)$/,
-        web ({ value }) {
-          const parsed = parseMustacheWithContext(value)
+        test: /^(class|wx:class)$/,
+        web ({ value }, { el }) {
+          if (el.isClassParsed) {
+            return false
+          }
+          const classBinding = []
+          el.isClassParsed = true
+          el.attrsList.filter(item => this.test.test(item.name)).forEach((item) => {
+            const parsed = parseMustacheWithContext(item.value)
+            classBinding.push(parsed.result)
+          })
           return {
             name: ':class',
-            value: parsed.result
+            value: `[${classBinding}]`
           }
         }
       },

diff --git a/packages/webpack-plugin/lib/runtime/components/web/mpx-movable-view.vue b/packages/webpack-plugin/lib/runtime/components/web/mpx-movable-view.vue
@@ -178,7 +178,7 @@
             this.refresh()
           })
           const elementToObserve = document.querySelector('.mpx-movable-scroll-content')
-          this.resizeObserver.observe(elementToObserve)
+          elementToObserve && this.resizeObserver.observe(elementToObserve)
         }
       },
       refresh () {

diff --git a/packages/webpack-plugin/lib/runtime/components/web/mpx-picker-view-column.vue b/packages/webpack-plugin/lib/runtime/components/web/mpx-picker-view-column.vue
@@ -15,7 +15,13 @@
   export default {
     name: 'mpx-picker-view-column',
     props: {
-      value: Array
+      value: Array,
+      scrollOptions: {
+        type: Object,
+        default: () => {
+          return {}
+        }
+      }
     },
     data() {
       return {
@@ -64,7 +70,9 @@
               rotate: -5,
               wheelWrapperClass: 'wheel-scroll'
             },
-            probeType: 3
+            probeType: 3,
+            bindToWrapper: true,
+            ...this.scrollOptions
           })
           this.wheels[0].on('scrollStart', function () {
             if (this.pickerView) {

diff --git a/packages/webpack-plugin/lib/runtime/components/web/mpx-picker.vue b/packages/webpack-plugin/lib/runtime/components/web/mpx-picker.vue
@@ -138,6 +138,12 @@
       fields: {
         type: String,
         default: 'day'
+      },
+      scrollOptions: {
+        type: Object,
+        default: () => {
+          return {}
+        }
       }
     },
     data () {
@@ -311,7 +317,9 @@
                     wheelWrapperClass: 'wheel-scroll',
                     wheelItemClass: 'wheel-item'
                   },
-                  probeType: 3
+                  probeType: 3,
+                  bindToWrapper: true,
+                  ...this.scrollOptions
                 })
                 if (this.mode === 'time' || this.mode === 'date') {
                   this.wheels[i].on('scrollStart', function (i) {

diff --git a/packages/webpack-plugin/lib/runtime/components/web/mpx-swiper.vue b/packages/webpack-plugin/lib/runtime/components/web/mpx-swiper.vue
@@ -47,7 +47,7 @@
         default: () => {
           return {}
         }
-      },
+      }
     },
     data () {
       return {
@@ -212,7 +212,7 @@
         this.bs.scroller.hooks.on('beforeRefresh', () => {
           this.initLayerComputed()
         })
-        this.bs.on('slideWillChange', (page) => {
+        this.bs.on('slidePageChanged', (page) => {
           this.currentIndex = this.vertical ? page.pageY : page.pageX
           this.$emit('change', getCustomEvent('change', {
             current: this.currentIndex,