diff --git a/packages/vant/src/search/README.md b/packages/vant/src/search/README.md index 8a5cf6a1e..a03a5fc0a 100644 --- a/packages/vant/src/search/README.md +++ b/packages/vant/src/search/README.md @@ -107,11 +107,29 @@ Use `action` slot to custom right button, `cancel` event will no longer be Emitt @search="onSearch" > ``` +```js +import { ref } from 'vue'; +import { Toast } from 'vant'; + +export default { + setup() { + const value = ref(''); + const onSearch = (val) => Toast(val); + const onClickButton = () => Toast(value.value); + return { + value, + onSearch, + onClickButton, + }; + }, +}; +``` + ## API ### Props diff --git a/packages/vant/src/search/README.zh-CN.md b/packages/vant/src/search/README.zh-CN.md index 44b5c609e..9d70a0d38 100644 --- a/packages/vant/src/search/README.zh-CN.md +++ b/packages/vant/src/search/README.zh-CN.md @@ -119,11 +119,29 @@ export default { @search="onSearch" > ``` +```js +import { ref } from 'vue'; +import { Toast } from 'vant'; + +export default { + setup() { + const value = ref(''); + const onSearch = (val) => Toast(val); + const onClickButton = () => Toast(value.value); + return { + value, + onSearch, + onClickButton, + }; + }, +}; +``` + ## API ### Props diff --git a/packages/vant/src/search/demo/index.vue b/packages/vant/src/search/demo/index.vue index 44cc56ecd..f8007a0c2 100644 --- a/packages/vant/src/search/demo/index.vue +++ b/packages/vant/src/search/demo/index.vue @@ -34,6 +34,7 @@ const value6 = ref(''); const onSearch = (val: string) => Toast(val); const onCancel = () => Toast(t('cancel')); +const onClickButton = () => Toast(value6.value);