Skip to content

H
hello uni-app x

DCloud / hello uni-app x

通知 5995
Star 90
Fork 162
H
hello uni-app x
提交 07baaa2f 编写于 作者: Y yurj26
浏览文件
操作

feat(API): add prompt apis

上级 1ed51d45
隐藏空白更改
内联 并排
Showing with 257 addition and 2 deletion
pages.json
浏览文件 @ 07baaa2f
......@@ -96,6 +96,30 @@
"style": {
"navigationBarTitleText": "数据存储"
}
},
{
"path": "pages/API/action-sheet/action-sheet",
"style": {
"navigationBarTitleText": "操作菜单"
}
},
{
"path": "pages/API/modal/modal",
"style": {
"navigationBarTitleText": "模态弹窗"
}
},
{
"path": "pages/API/show-loading/show-loading",
"style": {
"navigationBarTitleText": "加载提示框"
}
},
{
"path": "pages/API/toast/toast",
"style": {
"navigationBarTitleText": "消息提示框"
}
}
],
"globalStyle": {
......
pages/API/action-sheet/action-sheet.uvue 0 → 100644
浏览文件 @ 07baaa2f
<template>
<view>
<page-head :title="title"></page-head>
<view class="uni-padding-wrap">
<view class="uni-btn-v">
<button class="target" type="default" @tap="actionSheetTap">弹出action sheet</button>
</view>
</view>
</view>
</template>
<script lang="ts">
export default {
data() {
return {
title: 'action-sheet',
// #ifdef H5
buttonRect: {},
// #endif
}
},
// #ifdef H5
onReady() {
this.getNodeInfo()
window.addEventListener('resize', this.getNodeInfo)
},
beforeDestroy() {
window.removeEventListener('resize', this.getNodeInfo)
},
// #endif
methods: {
actionSheetTap() {
const that = this
uni.showActionSheet({
title: '标题',
itemList: ['item1', 'item2', 'item3', 'item4'],
// #ifdef H5
popover: {
// 104: navbar + topwindow 高度，暂时 fix createSelectorQuery 在 pc 上获取 top 不准确的 bug
top: that.buttonRect.top + 104 + that.buttonRect.height,
left: that.buttonRect.left + that.buttonRect.width / 2
},
// #endif
success: (e) => {
console.log(e.tapIndex);
uni.showToast({
title: "点击了第" + e.tapIndex + "个选项",
icon: "none"
})
}
})
},
// #ifdef H5
getNodeInfo() {
uni.createSelectorQuery().select('.target').boundingClientRect().exec((ret) => {
const rect = ret[0]
if (rect) {
this.buttonRect = rect
}
});
}
// #endif
}
}
</script>
\ No newline at end of file
pages/API/modal/modal.uvue 0 → 100644
浏览文件 @ 07baaa2f
<template>
<view>
<page-head :title="title"></page-head>
<view class="uni-padding-wrap uni-common-mt">
<view class="uni-btn-v">
<button class="uni-btn" type="default" @tap="modalTap">有标题的modal</button>
<button class="uni-btn" type="default" @tap="noTitlemodalTap">无标题的modal</button>
</view>
</view>
</view>
</template>
<script lang="ts">
export default {
data() {
return {
title: 'modal'
}
},
methods: {
modalTap: function () {
uni.showModal({
title: "弹窗标题",
content: "弹窗内容，告知当前状态、信息和解决方法，描述文字尽量控制在三行内",
showCancel: false,
confirmText: "确定"
})
},
noTitlemodalTap: function () {
uni.showModal({
content: "弹窗内容，告知当前状态、信息和解决方法，描述文字尽量控制在三行内",
confirmText: "确定",
cancelText: "取消"
})
}
}
}
</script>
\ No newline at end of file
pages/API/show-loading/show-loading.uvue 0 → 100644
浏览文件 @ 07baaa2f
<template>
<view>
<page-head :title="title"></page-head>
<view class="uni-padding-wrap">
<view class="uni-btn-v">
<button class="uni-btn" type="primary" @click="showLoading">显示 loading 提示框</button>
<!-- #ifndef MP-ALIPAY -->
<button class="uni-btn" @click="hideLoading">隐藏 loading 提示框</button>
<!-- #endif -->
</view>
</view>
</view>
</template>
<script lang="ts">
export default {
data() {
return {
title: 'loading'
}
},
methods: {
showLoading: function() {
uni.showLoading({
title: 'loading'
});
// #ifdef MP-ALIPAY
this._showTimer && clearTimeout(this._showTimer);
this._showTimer = setTimeout(() => {
this.hideLoading();
}, 3000)
// #endif
},
hideLoading: function() {
uni.hideLoading();
}
}
// #ifdef MP-ALIPAY
,
onUnload() {
this._showTimer && clearTimeout(this._showTimer);
}
// #endif
}
</script>
\ No newline at end of file
pages/API/toast/toast.uvue 0 → 100644
浏览文件 @ 07baaa2f
<template>
<view>
<page-head :title="title"></page-head>
<view class="uni-padding-wrap">
<view class="uni-btn-v">
<button class="uni-btn" type="default" @tap="toast1Tap">点击弹出默认toast</button>
<button class="uni-btn" type="default" @tap="toast2Tap">点击弹出设置duration的toast</button>
<button class="uni-btn" type="default" @tap="toast3Tap">点击弹出显示loading的toast</button>
<!-- #ifndef MP-ALIPAY -->
<button class="uni-btn" type="default" @tap="toast4Tap">点击弹出显示自定义图片的toast</button>
<!-- #endif -->
<!-- #ifdef APP-PLUS -->
<button class="uni-btn" type="default" @tap="toast5Tap">点击显示无图标的居底toast</button>
<!-- #endif -->
<button class="uni-btn" type="default" @tap="hideToast">点击隐藏toast</button>
</view>
</view>
</view>
</template>
<script lang="ts">
export default {
data() {
return {
title: 'toast',
_showTimer: 0
}
},
// #ifdef MP-ALIPAY
onUnload() {
clearTimeout(this._showTimer);
},
// #endif
methods: {
toast1Tap: function () {
uni.showToast({
title: "默认"
})
},
toast2Tap: function () {
uni.showToast({
title: "duration 3000",
duration: 3000
})
},
toast3Tap: function () {
uni.showToast({
title: "loading",
icon: "loading",
duration: 5000
})
// #ifdef MP-ALIPAY
this._showTimer = setTimeout(() => {
// icon 是 loading 时，showToast 实际执行的是 showLoading
my.hideLoading()
// 执行完所有代码再清除定时器
clearTimeout(this._showTimer);
}, 3000)
// #endif
},
toast4Tap: function () {
uni.showToast({
title: "logo",
image: "/static/uni.png"
})
},
// #ifdef APP-PLUS
toast5Tap: function () {
uni.showToast({
title: "显示一段轻提示",
position: 'bottom'
})
},
// #endif
hideToast: function () {
uni.hideToast()
}
}
}
</script>
\ No newline at end of file
pages/tabBar/API/API.uvue
浏览文件 @ 07baaa2f
......@@ -16,7 +16,8 @@
</view>
<view class="uni-panel-c" v-if="item.open">
<view class="uni-navigate-item" v-for="(page,key) in item.pages" :key="key" @click="goDetailPage(page)">
<text class="uni-navigate-text" :class="page.enable != true ? 'text-disabled' : ''">{{page.name}}</text>
<text class="uni-navigate-text"
:class="page.enable != true ? 'text-disabled' : ''">{{page.name}}</text>
<image :src="arrowRightIcon" class="uni-icon"></image>
</view>
</view>
......@@ -94,18 +95,22 @@
{
name: "显示操作菜单",
url: "action-sheet",
enable: true
},
{
name: "显示模态弹窗",
url: "modal",
enable: true
},
{
name: "显示加载提示框",
url: "show-loading",
enable: true
},
{
name: "显示消息提示框",
url: "toast",
enable: true
},
] as Page[],
},
......@@ -317,7 +322,7 @@
pages: [
{
name: "数据存储（key-value）",
url: "storage",
url: "storage",
enable: true
},
// #ifdef APP-PLUS
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或