init

xhs-mini-demos/api-case/action-sheet/action-sheet.css

@@ -0,0 +1,4 @@
+
+.btn-area > *{
+  margin: 20px 0;
+}

xhs-mini-demos/api-case/action-sheet/action-sheet.js

@@ -0,0 +1,91 @@
+const __templateJs = require("./templates.js");
+const __mergePageOptions = require("../../util/mergePageOptions.js");
+Page(__mergePageOptions({
+  data: {
+    alertText: '警示文案',
+    itemColor: '#ff0000',
+    itemListLength: 4,
+    apiData: {
+      content: '',
+      success: false,
+      fail: false,
+      complete: false
+    }
+  },
+  handleAlertText(e) {
+    this.setData({
+      alertText: e.detail.value
+    });
+  },
+  handleItemColor(e) {
+    this.setData({
+      itemColor: e.detail.value
+    });
+  },
+  handleItemListLength(e) {
+    this.setData({
+      itemListLength: e.detail.value
+    });
+  },
+  resetApiData() {
+    this.setData({
+      apiData: {
+        success: false,
+        fail: false,
+        complete: false,
+        content: ''
+      }
+    });
+  },
+  updateApiData(type, content) {
+    const apiData = {
+      ...this.data.apiData
+    };
+    apiData[type] = true;
+    apiData.content = content;
+    this.setData({
+      apiData
+    });
+  },
+  onShareAppMessage() {
+    return {
+      title: '操作菜单',
+      path: 'packageAPI/pages/action-sheet/action-sheet'
+    };
+  },
+  itemList() {
+    return Array(this.data.itemListLength - 0).fill('item');
+  },
+  common(options) {
+    this.resetApiData();
+    xhs.showActionSheet({
+      ...options,
+      success: res => {
+        this.updateApiData('success', res);
+      },
+      fail: res => {
+        this.updateApiData('fail', res);
+      },
+      complete: res => {
+        this.updateApiData('complete', res);
+      }
+    });
+  },
+  actionSheetTap() {
+    this.common({
+      itemList: this.itemList()
+    });
+  },
+  actionSheetTapAlertText() {
+    this.common({
+      alertText: this.data.alertText,
+      itemList: this.itemList()
+    });
+  },
+  actionSheetTapColor() {
+    this.common({
+      itemList: this.itemList(),
+      itemColor: this.data.itemColor
+    });
+  }
+}, __templateJs));

xhs-mini-demos/api-case/action-sheet/action-sheet.json

@@ -0,0 +1,8 @@
+{
+  "navigationBarTitleText": "操作菜单",
+  "usingComponents": {
+    "showbox": "../../common/component/showbox/index",
+    "box": "../../common/component/container/index",
+    "api-status": "../../common/component/api-status/index"
+  }
+}

xhs-mini-demos/api-case/action-sheet/action-sheet.xhsml

@@ -0,0 +1,23 @@
+<view class="container">
+    <showbox title="操作菜单">
+      <box>
+        <view class="_ui-space">
+          <view class="_ui-input">
+            <input type="text" placeholder="警示文案"  bindinput="handleAlertText" />
+          </view>
+          <view class="_ui-input">
+            <input type="text" placeholder="itemColor: #ff0000" bindinput="handleItemColor" />
+          </view>
+          <view class="_ui-input">
+            <input type="text" placeholder="itemList长度" bindinput="handleItemListLength" />
+          </view>
+          
+          
+          <button class="_ui-button" hover-class="_ui-button-hover" bindtap="actionSheetTap">弹出action sheet</button>
+          <button class="_ui-button" hover-class="_ui-button-hover" bindtap="actionSheetTapAlertText">警示文案</button>
+          <button class="_ui-button" hover-class="_ui-button-hover" bindtap="actionSheetTapColor">Color</button>
+        </view>
+      </box>
+    </showbox>
+</view>
+<include src="templates.xhsml" />

xhs-mini-demos/api-case/action-sheet/templates.js

@@ -0,0 +1,65 @@
+/** 以下内容为自动生成，请勿手动修改 */
+
+module.exports = {
+  data: {
+    page_data_0: "",
+
+    page_data_1: "",
+
+    page_data_2: "",
+
+    page_data_3: false,
+
+    page_data_4: false,
+
+    page_data_5: false,
+
+    page_data_6: "",
+  },
+
+  page_fun_1(e) {
+    this.setData("page_data_0", e.detail.value);
+  },
+
+  page_fun_2(e) {
+    this.setData("page_data_1", e.detail.value);
+  },
+
+  page_fun_3(e) {
+    this.setData("page_data_2", e.detail.value);
+  },
+
+  page_fun_0() {
+    this.setData({
+      page_data_3: false,
+      page_data_4: false,
+      page_data_5: false,
+    });
+
+    xhs.showActionSheet({
+      success: (res) => {
+        console.log("success", res);
+        this.setData({
+          page_data_3: true,
+          page_data_6: JSON.stringify(res),
+        });
+      },
+      fail: (res) => {
+        console.log("fail", res);
+        this.setData({
+          page_data_4: true,
+          page_data_6: JSON.stringify(res),
+        });
+      },
+      complete: (res) => {
+        console.log("complete", res);
+        this.setData({
+          page_data_5: true,
+        });
+      },
+      alertText: this.data.page_data_0,
+      itemList: this.data.page_data_1,
+      itemColor: this.data.page_data_2,
+    });
+  },
+};

xhs-mini-demos/api-case/action-sheet/templates.xhsml

@@ -0,0 +1,36 @@
+<!-- 以下内容为自动生成，请勿手动修改 -->
+
+<view class="container">
+  <showbox title="showActionSheet演示">
+    <box>
+      <api-status
+        success="{{page_data_3}}"
+        complete="{{page_data_5}}"
+        fail="{{page_data_4}}"
+        text="{{page_data_6}}"
+      >
+      </api-status>
+      <view class="_ui-space _mt8">
+        <view class="_ui-input">
+          <input placeholder="alertText" type="text" bindinput="page_fun_1" />
+        </view>
+
+        <view class="_ui-input">
+          <input placeholder="itemList" type="text" bindinput="page_fun_2" />
+        </view>
+
+        <view class="_ui-input">
+          <input placeholder="itemColor" type="text" bindinput="page_fun_3" />
+        </view>
+
+        <button
+          class="_ui-button"
+          hover-class="_ui-button-hover"
+          bindtap="page_fun_0"
+        >
+          触发
+        </button>
+      </view>
+    </box>
+  </showbox>
+</view>