UniApp交互反馈API的使用示例

梦幻星辰 2024-07-14 ⋅ 20 阅读

介绍

在UniApp中,交互反馈API可以让开发者在应用程序中实现用户交互的各种反馈效果,提升用户体验。本文将介绍几种常用的交互反馈API的使用示例。

1. 显示模态弹窗

uni.showModal({
  title: '提示',
  content: '这是一个模态弹窗',
  success: function (res) {
    if (res.confirm) {
      console.log('用户点击确定');
    } else if (res.cancel) {
      console.log('用户点击取消');
    }
  }
});

2. 显示消息提示框

uni.showToast({
  title: '消息提示框',
  icon: 'none',
  duration: 2000
});

3. 显示加载中

uni.showLoading({
  title: '加载中'
});

setTimeout(function () {
  uni.hideLoading();
}, 2000);

4. 显示操作菜单

uni.showActionSheet({
  itemList: ['选项一', '选项二', '选项三'],
  success: function (res) {
    console.log(res.tapIndex);
  },
});

5. 显示下拉刷新

onPullDownRefresh: function () {
  uni.startPullDownRefresh();
  
  setTimeout(function () {
    uni.stopPullDownRefresh();
  }, 2000);
}

6. 显示键盘

uni.showKeyboard({
  defaultValue: '默认文本',
  success: function (res) {
    console.log(res.value);
  }
});

7. 显示操作Sheet

uni.showActionSheet({
  itemList: ['删除', '编辑'],
  itemColor: '#d81e06',
  success: function (res) {
    if (res.tapIndex === 0) {
      console.log('用户点击了删除按钮');
    } else if (res.tapIndex === 1) {
      console.log('用户点击了编辑按钮');
    }
  }
});

8. 显示键盘输入密码

uni.showKeyboard({
  confirmHold: true,
  success: function (res) {
    uni.vibrateShort();
    console.log(res.value);
  }
});

结论

以上是几种常用的交互反馈API的使用示例。通过这些API,开发者可以实现各种交互反馈效果,提升应用程序的用户体验。


全部评论: 0

    我有话说: