mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
docs(Search): update action slot demo (#10133)
This commit is contained in:
parent
7831553bee
commit
ac85f82f09
@ -107,11 +107,29 @@ Use `action` slot to custom right button, `cancel` event will no longer be Emitt
|
|||||||
@search="onSearch"
|
@search="onSearch"
|
||||||
>
|
>
|
||||||
<template #action>
|
<template #action>
|
||||||
<div @click="onSearch">Search</div>
|
<div @click="onClickButton">Search</div>
|
||||||
</template>
|
</template>
|
||||||
</van-search>
|
</van-search>
|
||||||
```
|
```
|
||||||
|
|
||||||
|
```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
|
## API
|
||||||
|
|
||||||
### Props
|
### Props
|
||||||
|
@ -119,11 +119,29 @@ export default {
|
|||||||
@search="onSearch"
|
@search="onSearch"
|
||||||
>
|
>
|
||||||
<template #action>
|
<template #action>
|
||||||
<div @click="onSearch">搜索</div>
|
<div @click="onClickButton">搜索</div>
|
||||||
</template>
|
</template>
|
||||||
</van-search>
|
</van-search>
|
||||||
```
|
```
|
||||||
|
|
||||||
|
```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
|
## API
|
||||||
|
|
||||||
### Props
|
### Props
|
||||||
|
@ -34,6 +34,7 @@ const value6 = ref('');
|
|||||||
|
|
||||||
const onSearch = (val: string) => Toast(val);
|
const onSearch = (val: string) => Toast(val);
|
||||||
const onCancel = () => Toast(t('cancel'));
|
const onCancel = () => Toast(t('cancel'));
|
||||||
|
const onClickButton = () => Toast(value6.value);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@ -83,7 +84,7 @@ const onCancel = () => Toast(t('cancel'));
|
|||||||
@search="onSearch"
|
@search="onSearch"
|
||||||
>
|
>
|
||||||
<template #action>
|
<template #action>
|
||||||
<div @click="onSearch">{{ t('search') }}</div>
|
<div @click="onClickButton">{{ t('search') }}</div>
|
||||||
</template>
|
</template>
|
||||||
</van-search>
|
</van-search>
|
||||||
</demo-block>
|
</demo-block>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user