mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
docs(SwipeCell): use composition api
This commit is contained in:
parent
d1f637afc7
commit
75f8e36923
@ -71,9 +71,11 @@ app.use(SwipeCell);
|
||||
```
|
||||
|
||||
```js
|
||||
import { Dialog } from 'vant';
|
||||
|
||||
export default {
|
||||
methods: {
|
||||
beforeClose({ position, instance }) {
|
||||
setup() {
|
||||
const beforeClose = ({ position }) => {
|
||||
switch (position) {
|
||||
case 'left':
|
||||
case 'cell':
|
||||
@ -81,14 +83,14 @@ export default {
|
||||
return true;
|
||||
case 'right':
|
||||
return new Promise((resolve) => {
|
||||
this.$dialog
|
||||
.confirm({
|
||||
message: 'Are you sure to delete?',
|
||||
})
|
||||
.then(resolve);
|
||||
Dialog.confirm({
|
||||
title: 'Are you sure to delete?',
|
||||
}).then(resolve);
|
||||
});
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
return { beforeClose };
|
||||
},
|
||||
};
|
||||
```
|
||||
|
@ -81,10 +81,12 @@ app.use(SwipeCell);
|
||||
```
|
||||
|
||||
```js
|
||||
import { Dialog } from 'vant';
|
||||
|
||||
export default {
|
||||
methods: {
|
||||
setup() {
|
||||
// position 为关闭时点击的位置
|
||||
beforeClose({ position }) {
|
||||
const beforeClose = ({ position }) => {
|
||||
switch (position) {
|
||||
case 'left':
|
||||
case 'cell':
|
||||
@ -92,14 +94,14 @@ export default {
|
||||
return true;
|
||||
case 'right':
|
||||
return new Promise((resolve) => {
|
||||
this.$dialog
|
||||
.confirm({
|
||||
message: '确定删除吗?',
|
||||
})
|
||||
.then(resolve);
|
||||
Dialog.confirm({
|
||||
title: '确定删除吗?',
|
||||
}).then(resolve);
|
||||
});
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
return { beforeClose };
|
||||
},
|
||||
};
|
||||
```
|
||||
|
@ -45,39 +45,37 @@
|
||||
</demo-block>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
<script lang="ts">
|
||||
import { useTranslate } from '@demo/use-translate';
|
||||
import Dialog from '../../dialog';
|
||||
|
||||
const i18n = {
|
||||
'zh-CN': {
|
||||
select: '选择',
|
||||
delete: '删除',
|
||||
collect: '收藏',
|
||||
title: '单元格',
|
||||
confirm: '确定删除吗?',
|
||||
cardTitle: '商品标题',
|
||||
beforeClose: '异步关闭',
|
||||
customContent: '自定义内容',
|
||||
},
|
||||
'en-US': {
|
||||
select: 'Select',
|
||||
delete: 'Delete',
|
||||
collect: 'Collect',
|
||||
title: 'Cell',
|
||||
confirm: 'Are you sure to delete?',
|
||||
cardTitle: 'Title',
|
||||
beforeClose: 'Before Close',
|
||||
customContent: 'Custom Content',
|
||||
},
|
||||
};
|
||||
|
||||
export default {
|
||||
i18n: {
|
||||
'zh-CN': {
|
||||
select: '选择',
|
||||
delete: '删除',
|
||||
collect: '收藏',
|
||||
title: '单元格',
|
||||
confirm: '确定删除吗?',
|
||||
cardTitle: '商品标题',
|
||||
beforeClose: '异步关闭',
|
||||
customContent: '自定义内容',
|
||||
},
|
||||
'en-US': {
|
||||
select: 'Select',
|
||||
delete: 'Delete',
|
||||
collect: 'Collect',
|
||||
title: 'Cell',
|
||||
confirm: 'Are you sure to delete?',
|
||||
cardTitle: 'Title',
|
||||
beforeClose: 'Before Close',
|
||||
customContent: 'Custom Content',
|
||||
},
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
imageURL: 'https://img.yzcdn.cn/vant/ipad.jpeg',
|
||||
};
|
||||
},
|
||||
|
||||
methods: {
|
||||
beforeClose({ position }) {
|
||||
setup() {
|
||||
const t = useTranslate(i18n);
|
||||
const beforeClose = ({ position }: { position: string }) => {
|
||||
switch (position) {
|
||||
case 'left':
|
||||
case 'cell':
|
||||
@ -85,14 +83,18 @@ export default {
|
||||
return true;
|
||||
case 'right':
|
||||
return new Promise((resolve) => {
|
||||
this.$dialog
|
||||
.confirm({
|
||||
message: this.t('confirm'),
|
||||
})
|
||||
.then(resolve);
|
||||
Dialog.confirm({
|
||||
title: t('confirm'),
|
||||
}).then(resolve);
|
||||
});
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
return {
|
||||
t,
|
||||
imageURL: 'https://img.yzcdn.cn/vant/ipad.jpeg',
|
||||
beforeClose,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
Loading…
x
Reference in New Issue
Block a user