feat(signature): support tips slot (#13385)

This commit is contained in:
chouchouji
2025-03-15 19:49:16 +08:00
committed by GitHub
parent 4594a861dd
commit d1a71dd6e7
3 changed files with 15 additions and 1 deletions

View File

@@ -99,6 +99,12 @@ Use `background-color` prop to set the color of the background.
| submit | Emitted when clicking the confirm button | _data: { image: string; canvas: HTMLCanvasElement }_ |
| clear | Emitted when clicking the cancel button | - |
### Slots
| Name | Description | SlotProps |
| ---- | ----------- | --------- |
| tips | Custom tips | - |
### Methods
Use [ref](https://vuejs.org/guide/essentials/template-refs.html) to get Signature instance and call instance methods.

View File

@@ -99,6 +99,12 @@ export default {
| submit | 点击确定按钮时触发 | _data: { image: string; canvas: HTMLCanvasElement }_ |
| clear | 点击取消按钮时触发 | - |
### Slots
| 名称 | 说明 | 参数 |
| ---- | -------------- | ---- |
| tips | 自定义提示文案 | - |
### 方法
通过 ref 可以获取到 Signature 实例并调用实例方法,详见[组件实例方法](#/zh-CN/advanced-usage#zu-jian-shi-li-fang-fa)。

View File

@@ -53,7 +53,7 @@ export default defineComponent({
emits: ['submit', 'clear', 'start', 'end', 'signing'],
setup(props, { emit }) {
setup(props, { emit, slots }) {
const canvasRef = ref<HTMLCanvasElement>();
const wrapRef = ref<HTMLElement>();
const ctx = computed(() => {
@@ -195,6 +195,8 @@ export default defineComponent({
onTouchmove={touchMove}
onTouchend={touchEnd}
/>
) : slots.tips ? (
slots.tips()
) : (
<p>{props.tips}</p>
)}