arms-app 1.0.60 → 1.0.61

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/package.json +1 -1
  2. package/view/1.vue +13 -12
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "arms-app",
3
- "version": "1.0.60",
3
+ "version": "1.0.61",
4
4
  "description": "一个基于 Express 的 Web 应用1",
5
5
  "main": "index.js",
6
6
  "scripts": {
package/view/1.vue CHANGED
@@ -1,12 +1,14 @@
1
1
  <template>
2
2
  <div class="page">
3
- <h3>手动滚动 + 无缝循环示例</h3>
3
+ <h3>悬停停自动,手动仍可滚(无缝)</h3>
4
4
 
5
5
  <vue-seamless-scroll
6
6
  ref="ss"
7
7
  class="warp"
8
8
  :data="list"
9
9
  :class-option="option"
10
+ @mouseenter.native="hovering = true"
11
+ @mouseleave.native="hovering = false"
10
12
  @mousewheel.native.prevent="onWheel"
11
13
  @touchstart.native.passive="onTouchStart"
12
14
  @touchmove.native.prevent="onTouchMove"
@@ -28,31 +30,32 @@
28
30
  import VueSeamlessScroll from 'vue-seamless-scroll'
29
31
 
30
32
  export default {
31
- name: 'SeamlessManualScroll',
33
+ name: 'SeamlessHoverManual',
32
34
  components: {
33
35
  VueSeamlessScroll
34
36
  },
35
37
  data() {
36
38
  return {
37
39
  list: [],
38
- lastTouchY: 0
40
+ lastTouchY: 0,
41
+ hovering: false,
42
+ autoStep: 0.3 // 自动滚动速度
39
43
  }
40
44
  },
41
45
  computed: {
42
46
  option() {
43
47
  return {
44
- step: 0, // 0 = 纯手动;改成 0.3 即自动 + 手动
45
- direction: 1, // 向上滚
46
- hoverStop: true,
47
- limitMoveNum: 1, // 数据再少也开启循环
48
+ step: this.hovering ? 0 : this.autoStep, // 悬停停自动
49
+ direction: 1,
50
+ hoverStop: false, // 关闭内置 hoverStop
51
+ limitMoveNum: 1,
48
52
  openWatch: true
49
53
  }
50
54
  }
51
55
  },
52
56
  mounted() {
53
57
  // 模拟数据
54
- this.list = Array.from({ length: 12 }, (_, i) => `列表项 ${i + 1}`)
55
-
58
+ this.list = Array.from({ length: 15 }, (_, i) => `列表项 ${i + 1}`)
56
59
  this.$nextTick(() => {
57
60
  this.$refs.ss.reset()
58
61
  })
@@ -68,7 +71,7 @@ export default {
68
71
  // 顶部边界
69
72
  if (ss.yPos > 0) ss.yPos = 0
70
73
 
71
- // 超过一半高度,回到顶部(无缝关键)
74
+ // 底部回绕(无缝关键)
72
75
  if (Math.abs(ss.yPos) > ss.realBoxHeight / 2) {
73
76
  ss.yPos = 0
74
77
  }
@@ -96,7 +99,6 @@ export default {
96
99
  font-family: Arial, Helvetica, sans-serif;
97
100
  }
98
101
 
99
- /* 外层容器必须固定高度 + hidden */
100
102
  .warp {
101
103
  height: 260px;
102
104
  overflow: hidden;
@@ -104,7 +106,6 @@ export default {
104
106
  border-radius: 4px;
105
107
  }
106
108
 
107
- /* 列表内容 */
108
109
  .list {
109
110
  padding: 0 12px;
110
111
  }