ipad怎么制作网站,艺术品商城网站开发,wordpress修改title,网站404是什么意思目录 1. loading 提示框 1. 1 wx.showLoading()显示loading提示框 1.2 wx.hideLoading()关闭 loading 提示框 2. showModal 模态对话框 3. showToast 消息提示框 小程序提供了一些用于界面交互的 API#xff0c;例如#xff1a;loading 提示框、消息提示框、模态对… 目录 1.  loading 提示框 1. 1  wx.showLoading()显示loading提示框 1.2  wx.hideLoading()关闭 loading 提示框 2.  showModal 模态对话框 3.  showToast 消息提示框 小程序提供了一些用于界面交互的 API例如loading 提示框、消息提示框、模态对话框等 API。 1.  loading 提示框 loading 提示框常配合网络请求来使用用于增加用户体验对应的API 有两个: 1. wx.showLoading()显示loading提示框 2. wx.hideLoading()关闭 loading 提示框 1. 1  wx.showLoading()显示loading提示框 找到 index.js文件添加代码 // 显示 loading 提示框wx.showLoading({title: 数据正在加载中...,}) 完整的index.js代码 Page({data:{List:[]},// 获取数据getData(){// 显示 loading 提示框wx.showLoading({title: 数据正在加载中...,})// 如果需要发起网络请求需要使用 wx.request APIwx.request({// 接口地址url: https://gmall-prod.atguigu.cn/mall-api/index/findBanner,// 请求方式method:GET,// 请求参数,若没有则为空什么也不写data:{},// 请求头这里不需要暂时不写header:{},// API 调用成功以后执行的回调success:(res){// console.log(res)if(res.data.code 200){this.setData({List: res.data.data})}},// API 调用失败以后执行的回调fail:(err){console.log(err)},// API 无论成功或者失败执行的回调complete:(res){console.log(res)}})} }) 根据上图我们会发现并没有将“数据正在加载...”中的三个点加载出来那是因为提示的内容不会自动换行如果提示的内容比较多因为在同一行展示多出来的内容就会被隐藏掉我们可以将数据放的少一点来进行解决 不过此时我们再次点击“获取数据”会发现仍能进行点击 那是因为此时的mask默认为false 在小程序开发中mask: false 是指定一个布尔值的属性用于控制页面中的遮罩层是否显示。当 mask 的取值为 false 时表示不显示遮罩层而当 mask 的取值为 true 时表示显示遮罩层。         遮罩层通常用于在某些操作如加载数据、等待用户确认等进行时阻止用户对页面进行交互同时提供视觉上的提示。通过控制 mask 属性开发者可以灵活地控制页面中遮罩层的显示与隐藏以提升用户体验和交互效果。 此时的代码可以理解为 // 显示 loading 提示框wx.showLoading({title: 数据加载中...,// 是否展示透明蒙层防止触摸穿透mask: false})将false改为true则点击一次后会出现透明蒙层无法在进行点击 // 显示 loading 提示框wx.showLoading({title: 数据加载中...,// 是否展示透明蒙层防止触摸穿透mask: true}) 1.2  wx.hideLoading()关闭 loading 提示框 打开折叠的 wx.request 函数找到complete更改其内容 complete:(res){// console.log(res)// 关闭 Loading 提示框wx.hideLoading()} 则会发现点击完后展示内容提示框关闭 注意hideLoading和showLoading必须结合、配对使用。 2.  showModal 模态对话框 wx.showModal()模态对话框常用于询问用户是否执行一些操作。 例如询问用户是否退出登录、是否删除该商品等。 找到index.wxml文件创建一个按钮 button typeprimary bind:tapdelHandler删除商品/button 找到index.js文件给按钮添加相关属性 // 删除商品async delHandler(){// showModal 显示模态对话框const res await wx.showModal({title: 提示,content: 是否删除该商品})console.log(res)} 点击“删除商品” 点击“取消” 点击“确定” 3.  showToast 消息提示框 wx.showToast()消息提示框根据用户的某些操作来告知操作的结果。 例如退出成功给用户提示提示删除成功等。 编写代码 // 删除商品async delHandler(){// showModal 显示模态对话框const { confirm } await wx.showModal({title: 提示,content: 是否删除该商品})// console.log(res)if(confirm){// showToast消息提示框wx.showToast({title: 删除成功,// 不显示图标icon:none,// 消息提示框两秒后自动关闭duration:2000})}else{wx.showToast({title: 取消删除,icon:error,// 消息提示框两秒后自动关闭duration:2000})}} 点击取消 点击确定 微信小程序开发_时光の尘的博客-CSDN博客