小程序常用界面交互api

前端-七木2024-08-27 13:19

1. wx.showToast 显示消息提示框

显示一个消息提示框，一般用于操作成功后的提示

javascript 复制代码

wx.showToast({
  title: '操作成功',
  icon: 'success',
  duration: 2000
});

2. wx.showModal 显示模态弹窗

显示一个模态弹窗，可以用于提醒用户重要信息或让用户进行选择

javascript 复制代码

wx.showModal({
  title: '提示',
  content: '确认删除此项吗？',
  success: function (res) {
    if (res.confirm) {
      console.log('用户点击确定')
    } else if (res.cancel) {
      console.log('用户点击取消')
    }
  }
});

3. wx.showLoading 加载中

javascript 复制代码

wx.showLoading({
  title: '加载中',
})

//关闭：wx.hideLoading()

4. wx.showActionSheet 显示操作菜单

显示操作菜单，一般用于用户选择操作项

javascript 复制代码

wx.showActionSheet({
  itemList: ['选项1', '选项2', '选项3'],
  success: function (res) {
    console.log('选择了第' + res.tapIndex + '项')
  },
  fail: function (res) {
    console.log(res.errMsg)
  }
});

5. wx.pageScrollTo 页面滚动

javascript 复制代码

wx.pageScrollTo({
  scrollTop: 0, // 滚动到页面顶部
  duration: 300
});

6. wx.setNavigationBarTitle 设置导航栏标题

javascript 复制代码

wx.pageScrollTo({
  scrollTop: 0, // 滚动到页面顶部
  duration: 300
});