mirror of
https://gitee.com/wot-design-uni/wot-design-uni.git
synced 2025-12-07 17:48:34 +08:00
refactor: ♻️ 移除MessageBox需要传入use-slot才可以使用插槽的逻辑优化使用体验
This commit is contained in:
parent
eaeb935a29
commit
d712e22e57
@ -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>
|
||||
|
||||
|
||||
@ -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">
|
||||
|
||||
@ -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
|
||||
}
|
||||
|
||||
@ -29,9 +29,8 @@
|
||||
</view>
|
||||
</block>
|
||||
<!--使用插槽-->
|
||||
<slot v-if="useSlot"></slot>
|
||||
<slot>{{ msg }}</slot>
|
||||
<!--使用文本-->
|
||||
<block v-else>{{ msg }}</block>
|
||||
</view>
|
||||
</view>
|
||||
<!--action按钮组合-->
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user