refactor: ♻️ 移除MessageBox需要传入use-slot才可以使用插槽的逻辑优化使用体验

This commit is contained in:
weisheng 2024-04-09 22:17:41 +08:00
parent eaeb935a29
commit d712e22e57
4 changed files with 13 additions and 6 deletions

View File

@ -124,7 +124,7 @@ function prompt() {
如果提供的弹框内容不满足需求,可以使用插槽自定义弹框内容。可以通过指定唯一标识`selector`的方式,在一个页面中使用多个`MessageBox`,`useMessage(selector)`会返回一个指定了`selector`的组件实例。
```html
<wd-message-box selector="wd-message-box-slot" use-slot>
<wd-message-box selector="wd-message-box-slot">
<wd-rate custom-class="custom-rate-class" v-model="rate"/>
</wd-message-box>

View File

@ -1,7 +1,7 @@
<template>
<page-wraper>
<wd-message-box></wd-message-box>
<wd-message-box selector="wd-message-box-slot" use-slot>
<wd-message-box selector="wd-message-box-slot">
<wd-rate custom-class="custom-rate-class" v-model="rate" />
</wd-message-box>
<demo-block title="alert">

View File

@ -1,4 +1,13 @@
import { baseProps, makeBooleanProp } from '../common/props'
/*
* @Author: weisheng
* @Date: 2024-04-08 22:34:01
* @LastEditTime: 2024-04-09 22:07:26
* @LastEditors: weisheng
* @Description:
* @FilePath: /wot-design-uni/src/uni_modules/wot-design-uni/components/wd-message-box/types.ts
*
*/
import { baseProps } from '../common/props'
export type MessageType = 'alert' | 'confirm' | 'prompt'
@ -95,6 +104,5 @@ export interface Message {
export const messageBoxProps = {
...baseProps,
useSlot: makeBooleanProp(false),
selector: String
}

View File

@ -29,9 +29,8 @@
</view>
</block>
<!--使用插槽-->
<slot v-if="useSlot"></slot>
<slot>{{ msg }}</slot>
<!--使用文本-->
<block v-else>{{ msg }}</block>
</view>
</view>
<!--action按钮组合-->