blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

types(Button): use tsx

Browse Source
This commit is contained in:
chenjiahan 2020-09-19 23:24:13 +08:00
parent 40085b72fe
commit fe7e2faf6c
1 changed files with 18 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/button/index.js → src/button/index.tsx
View File

@ -1,3 +1,5 @@
import { PropType } from 'vue';
// Utils // Utils
import { createNamespace } from '../utils'; import { createNamespace } from '../utils';
import { BORDER_SURROUND, WHITE } from '../utils/constant'; import { BORDER_SURROUND, WHITE } from '../utils/constant';
@ -9,6 +11,15 @@ import Loading from '../loading';
const [createComponent, bem] = createNamespace('button'); const [createComponent, bem] = createNamespace('button');
export type ButtonType =
| 'default'
| 'primary'
| 'success'
| 'warning'
| 'danger';
export type ButtonSize = 'large' | 'normal' | 'small' | 'mini';
export default createComponent({ export default createComponent({
props: { props: {
...routeProps, ...routeProps,
@ -26,15 +37,15 @@ export default createComponent({
loadingText: String, loadingText: String,
loadingType: String, loadingType: String,
tag: { tag: {
type: String, type: String as PropType<keyof HTMLElementTagNameMap>,
default: 'button', default: 'button',
}, },
type: { type: {
type: String, type: String as PropType<ButtonType>,
default: 'default', default: 'default',
}, },
size: { size: {
type: String, type: String as PropType<ButtonSize>,
default: 'normal', default: 'normal',
}, },
nativeType: { nativeType: {
@ -46,7 +57,7 @@ export default createComponent({
default: '20px', default: '20px',
}, },
iconPosition: { iconPosition: {
type: String, type: String as PropType<'left' | 'right'>,
default: 'left', default: 'left',
}, },
}, },
@ -103,7 +114,7 @@ export default createComponent({
const getStyle = () => { const getStyle = () => {
const { color, plain } = props; const { color, plain } = props;
if (color) { if (color) {
const style = {}; const style: Record<string, string> = {};
style.color = plain ? color : WHITE; style.color = plain ? color : WHITE;
@ -114,7 +125,7 @@ export default createComponent({
// hide border when color is linear-gradient // hide border when color is linear-gradient
if (color.indexOf('gradient') !== -1) { if (color.indexOf('gradient') !== -1) {
style.border = 0; style.border = '0';
} else { } else {
style.borderColor = color; style.borderColor = color;
} }
@ -123,7 +134,7 @@ export default createComponent({
} }
}; };
const onClick = (event) => { const onClick = (event: MouseEvent) => {
if (!props.loading && !props.disabled) { if (!props.loading && !props.disabled) {
emit('click', event); emit('click', event);
route(); route();