开始做工作台的抄表

pages/writeReading/components/meterList/index.js

@@ -0,0 +1,41 @@
+// pages/writeReading/components/meterList/index.js
+Component({
+
+  /**
+   * 组件的属性列表
+   */
+  properties: {
+
+  },
+
+  /**
+   * 组件的初始数据
+   */
+  data: {
+    animationData: {}, // 存储动画数据
+    position: -100
+  },
+  lifetimes: {
+    attached() {
+      // 在页面准备就绪时初始化动画实例
+    this.animation = wx.createAnimation({
+      duration: 500, // 动画持续时间，单位 ms
+      timingFunction: 'ease-out', // 动画缓动函数，还可以是 'linear', 'ease-in', 'ease-in-out'
+      delay: 0 // 动画延迟时间
+    });
+    }
+  },
+  /**
+   * 组件的方法列表
+   */
+  methods: {
+    handleLeft() {
+      // 将动画数据设置到 data 中，从而触发视图更新
+      
+      this.setData({
+        position: this.data.position - 100,
+      });
+  
+    }
+  }
+})

pages/writeReading/components/meterList/index.json

@@ -0,0 +1,6 @@
+{
+  "component": true,
+  "usingComponents": {
+    
+  }
+}

pages/writeReading/components/meterList/index.wxml

@@ -0,0 +1,24 @@
+<!--pages/writeReading/components/meterList/index.wxml-->
+
+<view class="wrapper">
+    <view class="title">
+        <text> 电表列表 </text>
+    </view>
+    <view style="display: flex; align-items: center;">
+        <view bind:tap="handleLeft">
+            左
+        </view>
+        <scroll-view
+            scroll-x="{{true}}"
+            class="meterListScrollView"
+        >
+            <view style="width: 1000px; margin-left: {{position}}rpx">
+            12345623425346356356356    12345623425346356356356    12345623425346356356356    12345623425346356356356
+            </view>
+        </scroll-view>
+        <view>
+            右
+        </view>
+    </view>
+    
+</view>

pages/writeReading/components/meterList/index.wxss

@@ -0,0 +1,16 @@
+/* pages/writeReading/components/meterList/index.wxss */
+
+.wrapper {
+    padding: 0 20rpx;
+}
+
+.title {
+    margin-top: 20rpx;
+}
+
+.meterListScrollView {
+    flex: 1;
+    margin-left: 20rpx;
+    margin-right: 20rpx;
+    overflow: hidden;
+}