[bugfix] remove unnecessary props (#323)

* fix: Tabbar icon line-height

* [new feature] progress add showPivot prop

* [new feature] TabItem support vue-router

* [new feature] update document header style

* [Doc] add toast english ducoment

* [bugfix] Search box-sizing wrong

* [Doc] update vant-demo respo

* [Doc] translate theme & demo pages

* [Doc] add Internationalization document

* [bugfix] remove unnecessary props
This commit is contained in:
neverland 2017-11-16 03:12:13 -06:00 committed by GitHub
parent 5cbc374208
commit ffa3fddfae
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
42 changed files with 116 additions and 306 deletions

View File

@ -14,7 +14,7 @@
icon="clear" icon="clear"
:placeholder="$t('usernamePlaceholder')" :placeholder="$t('usernamePlaceholder')"
required required
@clickIcon="username = ''" @click-icon="username = ''"
> >
</van-field> </van-field>

View File

@ -67,14 +67,14 @@ export default {
const toast = Toast.loading({ const toast = Toast.loading({
duration: 0, duration: 0,
forbidClick: true, forbidClick: true,
message: this.$t('text4')(3) message: this.$t('text4', 3)
}); });
let second = 3; let second = 3;
const timer = setInterval(() => { const timer = setInterval(() => {
second--; second--;
if (second) { if (second) {
toast.message = this.$t('text4')(second); toast.message = this.$t('text4', second);
} else { } else {
clearInterval(timer); clearInterval(timer);
Toast.clear(); Toast.clear();

View File

@ -56,11 +56,9 @@ Set grid spacing using `gutter` attribute. The default value is 0
| Attribute | Description | Type | Default | Accepted Values | | Attribute | Description | Type | Default | Accepted Values |
|-----------|-----------|-----------|-------------|-------------| |-----------|-----------|-----------|-------------|-------------|
| gutter | grid spacingpx | `String | Number` | - | - | | gutter | grid spacingpx | `String | Number` | - | - |
| prefix | className prefix | `String` | `van` | - |
#### Column #### Column
| Attribute | Description | Type | Default | Accepted Values | | Attribute | Description | Type | Default | Accepted Values |
|-----------|-----------|-----------|-------------|-------------| |-----------|-----------|-----------|-------------|-------------|
| span | number of column the grid spans | `String | Number` | - | - | | span | number of column the grid spans | `String | Number` | - | - |
| offset | number of spacing on the left side of the grid | `String | Number` | - | - | | offset | number of spacing on the left side of the grid | `String | Number` | - | - |
| prefix | className prefix | `String` | `van` | - |

View File

@ -52,11 +52,9 @@ Layout 组件提供了`24列栅格`,通过在`Col`上添加`span`属性设置
| 参数 | 说明 | 类型 | 默认值 | 可选值 | | 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------| |-----------|-----------|-----------|-------------|-------------|
| gutter | 列元素之间的间距单位为px | `String | Number` | - | - | | gutter | 列元素之间的间距单位为px | `String | Number` | - | - |
| prefix | className 前缀 | `String` | `van` | - |
#### Column #### Column
| 参数 | 说明 | 类型 | 默认值 | 可选值 | | 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------| |-----------|-----------|-----------|-------------|-------------|
| span | 列元素宽度 | `String | Number` | - | - | | span | 列元素宽度 | `String | Number` | - | - |
| offset | 列元素偏移距离 | `String | Number` | - | - | | offset | 列元素偏移距离 | `String | Number` | - | - |
| prefix | className 前缀 | `String` | `van` | - |

View File

@ -106,7 +106,7 @@
"style-loader": "^0.19.0", "style-loader": "^0.19.0",
"uppercamelcase": "^3.0.0", "uppercamelcase": "^3.0.0",
"url-loader": "^0.6.2", "url-loader": "^0.6.2",
"vant-doc": "0.3.17", "vant-doc": "0.3.18",
"vue": "^2.5.3", "vue": "^2.5.3",
"vue-loader": "^13.5.0", "vue-loader": "^13.5.0",
"vue-markdown-loader": "^2.2.3", "vue-markdown-loader": "^2.2.3",

View File

@ -10,7 +10,8 @@
v-for="(item, index) in actions" v-for="(item, index) in actions"
:key="index" :key="index"
:class="['van-actionsheet__item', 'van-hairline--top', item.className, { 'van-actionsheet__item--loading': item.loading }]" :class="['van-actionsheet__item', 'van-hairline--top', item.className, { 'van-actionsheet__item--loading': item.loading }]"
@click.stop="onClickItem(item)"> @click.stop="onClickItem(item)"
>
<template v-if="!item.loading"> <template v-if="!item.loading">
<span class="van-actionsheet__name">{{ item.name }}</span> <span class="van-actionsheet__name">{{ item.name }}</span>
<span class="van-actionsheet__subname" v-if="item.subname">{{ item.subname }}</span> <span class="van-actionsheet__subname" v-if="item.subname">{{ item.subname }}</span>
@ -18,8 +19,13 @@
<van-loading v-else class="van-actionsheet__loading" type="circle" color="black" /> <van-loading v-else class="van-actionsheet__loading" type="circle" color="black" />
</li> </li>
</ul> </ul>
<div class="van-actionsheet__item van-actionsheet__cancel van-hairline--top" @click.stop="$emit('input', false)" v-if="cancelText">{{ cancelText }}</div> <div
<div class="van-actionsheet__content" v-else> v-if="cancelText"
v-text="cancelText"
class="van-actionsheet__item van-actionsheet__cancel van-hairline--top"
@click.stop="$emit('input', false)"
/>
<div v-else class="van-actionsheet__content">
<slot></slot> <slot></slot>
</div> </div>
</div> </div>
@ -43,18 +49,16 @@ export default {
props: { props: {
value: Boolean, value: Boolean,
title: String,
cancelText: String,
actions: { actions: {
type: Array, type: Array,
default: () => [] default: () => []
}, },
title: String,
cancelText: String,
overlay: { overlay: {
type: Boolean,
default: true default: true
}, },
closeOnClickOverlay: { closeOnClickOverlay: {
type: Boolean,
default: true default: true
} }
}, },

View File

@ -1,55 +0,0 @@
## 定制主题
`Vant`提供了一套默认主题CSS 命名采用 BEM 的风格,方便使用者覆盖样式。如果你想完全替换主题色或者其他样式,可以使用下面的方法:
### 方案一. PostCSS 插件
在项目中直接引入组件对应的 postcss 源代码,并通过 postcss 插件 [postcss-theme-variables](https://www.npmjs.com/package/postcss-theme-variables) 替换颜色变量,步骤如下:
```javascript
// 引入基础样式
import 'vant/packages/vant-css/src/base.css';
// 引入组价对应的样式
import 'vant/packages/vant-css/src/button.css';
import 'vant/packages/vant-css/src/checkbox.css';
```
接着在 postcss.config.js 中引入所需的 postcss 插件,并根据项目需求配置颜色变量,所有可用的颜色变量请参考 [配置文件](https://github.com/youzan/vant/blob/dev/packages/vant-css/src/common/var.css)
```javascript
module.exports = {
plugins: [
require('postcss-easy-import')({
extensions: ['pcss', 'css']
}),
require('postcss-theme-variables')({
vars: {
red: '#F60',
gray: '#CCC',
blue: '#03A9F4'
},
prefix: '$'
}),
require('precss')(),
require('postcss-calc')(),
require('autoprefixer')({
browsers: ['Android >= 4.0', 'iOS >= 7']
})
]
};
```
### 方案二. 本地构建
可以通过在本地构建 vant-css 的方式生成所需的主题
```bash
# 克隆仓库
git clone git@github.com:youzan/vant.git
cd packages/vant-css
```
在本地 vant-css 仓库中,修改 src/common/var.css 中的颜色变量,然后执行以下构建命令,即可生成对应的样式文件
```bash
npm run build
```

View File

@ -1,6 +1,14 @@
<template> <template>
<div class="van-area"> <div class="van-area">
<van-picker ref="picker" :columns="areaColumns" value-key="name" show-toolbar @change="handleAreaChange" @confirm="handleAreaConfirm" @cancel="handleAreaCancel"></van-picker> <van-picker
ref="picker"
showToolbar
valueKey="name"
:columns="areaColumns"
@change="onChange"
@confirm="$emit('confirm', $event)"
@cancel="$emit('cancel')"
/>
</div> </div>
</template> </template>
@ -80,12 +88,7 @@ export default {
}, },
methods: { methods: {
/** // `code`
* 根据省市县类型和对应的`code`获取对应列表
*
* @param {string} type 省市县类型
* @param {string} code 对应code
*/
computedAreaList(type, code) { computedAreaList(type, code) {
const result = []; const result = [];
const curAreaList = this.areaList; const curAreaList = this.areaList;
@ -107,9 +110,7 @@ export default {
return result; return result;
}, },
/** //
* 获取对应省市县在列表中的索引
*/
getAreaIndex(type, code) { getAreaIndex(type, code) {
const compareNum = type === PROVINCE_TYPE const compareNum = type === PROVINCE_TYPE
? 2 ? 2
@ -125,7 +126,7 @@ export default {
return 0; return 0;
}, },
handleAreaChange(picker, values, index) { onChange(picker, values, index) {
const code = values[index].code; const code = values[index].code;
// //
if (index === 0) { if (index === 0) {
@ -143,14 +144,6 @@ export default {
[DEFAULT_COUNTY].concat(this.computedAreaList(COUNTY_TYPE, code.slice(0, 4))) [DEFAULT_COUNTY].concat(this.computedAreaList(COUNTY_TYPE, code.slice(0, 4)))
); );
} }
},
handleAreaConfirm(values) {
this.$emit('confirm', values);
},
handleAreaCancel() {
this.$emit('cancel');
} }
} }
}; };

View File

@ -10,17 +10,9 @@ export default {
name: 'van-badge', name: 'van-badge',
props: { props: {
title: { url: String,
type: String, info: String,
required: true title: String
},
url: {
type: String,
default: 'javascript:;'
},
info: {
type: String
}
}, },
beforeCreate() { beforeCreate() {
@ -29,8 +21,7 @@ export default {
computed: { computed: {
isSelect() { isSelect() {
const parent = this.$parent; return this.$parent.badges.indexOf(this) === this.$parent.activeKey;
return parent.badges.indexOf(this) === parent.activeKey;
} }
}, },

View File

@ -1,8 +1,5 @@
import Loading from '../loading'; import Loading from '../loading';
const ALLOWED_SIZE = ['mini', 'small', 'normal', 'large'];
const ALLOWED_TYPE = ['default', 'danger', 'primary'];
export default { export default {
name: 'van-button', name: 'van-button',
@ -22,13 +19,11 @@ export default {
}, },
type: { type: {
type: String, type: String,
default: 'default', default: 'default'
validator: value => ALLOWED_TYPE.indexOf(value) > -1
}, },
size: { size: {
type: String, type: String,
default: 'normal', default: 'normal'
validator: value => ALLOWED_SIZE.indexOf(value) > -1
} }
}, },

View File

@ -34,8 +34,8 @@ export default {
thumb: String, thumb: String,
title: String, title: String,
desc: String, desc: String,
num: [Number, String],
centered: Boolean, centered: Boolean,
num: [Number, String],
price: [Number, String] price: [Number, String]
} }
}; };

View File

@ -82,8 +82,8 @@ export default {
}, },
startDrag(event) { startDrag(event) {
this.startX = event.changedTouches[0].pageX; this.startX = event.touches[0].pageX;
this.startY = event.changedTouches[0].pageY; this.startY = event.touches[0].pageY;
}, },
onDrag(event) { onDrag(event) {
@ -93,8 +93,8 @@ export default {
return; return;
} }
const offsetTop = event.changedTouches[0].pageY - this.startY; const offsetTop = event.touches[0].pageY - this.startY;
const offsetLeft = event.changedTouches[0].pageX - this.startX; const offsetLeft = event.touches[0].pageX - this.startX;
if ((offsetLeft < 0 && -offsetLeft > this.rightWidth) || if ((offsetLeft < 0 && -offsetLeft > this.rightWidth) ||
(offsetLeft > 0 && offsetLeft > this.leftWidth) || (offsetLeft > 0 && offsetLeft > this.leftWidth) ||
(offsetLeft > 0 && !this.leftWidth) || (offsetLeft > 0 && !this.leftWidth) ||

View File

@ -101,10 +101,9 @@ export default {
methods: { methods: {
onClickLabel() { onClickLabel() {
if (this.isDisabled) { if (!this.isDisabled) {
return; this.currentValue = !this.currentValue;
} }
this.currentValue = !this.currentValue;
} }
} }
}; };

View File

@ -1,13 +1,11 @@
<template> <template>
<div <div
:class="[ :class="[`van-col`, {
`${prefix}-col`, [`van-col-${span}`]: span,
{ [`van-col-offset-${offset}`]: offset,
[`${prefix}-col-${span}`]: span, }]"
[`${prefix}-col-offset-${offset}`]: offset, :style="style"
} >
]"
:style="style">
<slot></slot> <slot></slot>
</div> </div>
</template> </template>
@ -18,11 +16,7 @@ export default {
props: { props: {
span: [Number, String], span: [Number, String],
offset: [Number, String], offset: [Number, String]
prefix: {
type: String,
default: 'van'
}
}, },
computed: { computed: {
@ -31,9 +25,7 @@ export default {
}, },
style() { style() {
const padding = `${this.gutter / 2}px`; const padding = `${this.gutter / 2}px`;
return this.gutter return this.gutter ? { paddingLeft: padding, paddingRight: padding } : {};
? { paddingLeft: padding, paddingRight: padding }
: {};
} }
} }
}; };

View File

@ -31,16 +31,12 @@ export default {
}, },
props: { props: {
tel: String,
name: String,
addText: String, addText: String,
type: { type: {
type: String, type: String,
default: 'add' default: 'add'
},
name: {
type: String
},
tel: {
type: String
} }
} }
}; };

View File

@ -13,8 +13,6 @@
<script> <script>
import Picker from '../picker'; import Picker from '../picker';
const allowedType = ['time', 'date', 'datetime'];
export default { export default {
name: 'van-datetime-picker', name: 'van-datetime-picker',
@ -25,10 +23,7 @@ export default {
props: { props: {
type: { type: {
type: String, type: String,
default: 'datetime', default: 'datetime'
validator(value) {
return allowedType.indexOf(value) > -1;
}
}, },
format: { format: {
type: String, type: String,
@ -58,7 +53,7 @@ export default {
type: Number, type: Number,
default: 23 default: 23
}, },
value: null value: {}
}, },
data() { data() {

View File

@ -44,16 +44,11 @@ export default {
mixins: [Popup, i18n], mixins: [Popup, i18n],
props: { props: {
title: String,
message: String,
callback: Function,
confirmButtonText: String, confirmButtonText: String,
cancelButtonText: String, cancelButtonText: String,
title: {
type: String,
default: ''
},
message: {
type: String,
default: ''
},
showConfirmButton: { showConfirmButton: {
type: Boolean, type: Boolean,
default: true default: true
@ -62,9 +57,6 @@ export default {
type: Boolean, type: Boolean,
default: false default: false
}, },
callback: {
type: Function
},
overlay: { overlay: {
default: true default: true
}, },

View File

@ -49,8 +49,6 @@
import Cell from '../cell'; import Cell from '../cell';
import Icon from '../icon'; import Icon from '../icon';
const VALID_TYPES = ['text', 'number', 'email', 'url', 'tel', 'date', 'time', 'datetime', 'password', 'textarea'];
export default { export default {
name: 'van-field', name: 'van-field',
@ -62,15 +60,14 @@ export default {
props: { props: {
type: { type: {
type: String, type: String,
default: 'text', default: 'text'
validator: value => VALID_TYPES.indexOf(value) > -1
}, },
value: {}, value: {},
icon: String, icon: String,
label: String, label: String,
error: Boolean, error: Boolean,
required: Boolean,
border: Boolean, border: Boolean,
required: Boolean,
autosize: Boolean, autosize: Boolean,
onIconClick: { onIconClick: {
type: Function, type: Function,

View File

@ -22,11 +22,8 @@ export default {
}, },
props: { props: {
primary: Boolean, url: String,
url: { primary: Boolean
type: String,
default: 'javascript:;'
}
} }
}; };
</script> </script>

View File

@ -16,15 +16,9 @@ export default {
}, },
props: { props: {
url: String,
icon: String, icon: String,
iconClass: { iconClass: String
type: String,
default: ''
},
url: {
type: String,
default: 'javascript:;'
}
} }
}; };
</script> </script>

View File

@ -7,12 +7,8 @@
<script> <script>
export default { export default {
name: 'van-icon', name: 'van-icon',
props: { props: {
name: { name: String
type: String,
required: true
}
} }
}; };
</script> </script>

View File

@ -34,9 +34,6 @@ export default {
overlay: { overlay: {
default: true default: true
}, },
lockOnScroll: {
default: true
},
closeOnClickOverlay: { closeOnClickOverlay: {
default: true default: true
} }

View File

@ -1,28 +1,23 @@
<template> <template>
<div :class="['van-loading', 'van-loading--' + type, 'van-loading--' + color]"> <div :class="['van-loading', 'van-loading--' + type, 'van-loading--' + color]">
<span :class="['van-loading__spinner', 'van-loading__spinner--' + type, 'van-loading__spinner--' + color]"> <span :class="['van-loading__spinner', 'van-loading__spinner--' + type, 'van-loading__spinner--' + color]">
<i v-if="type === 'spinner'" v-for="item in 12"></i> <i v-if="type === 'spinner'" v-for="item in 12" />
</span> </span>
</div> </div>
</template> </template>
<script> <script>
const VALID_TYPES = ['gradient-circle', 'circle', 'spinner'];
const VALID_COLORS = ['black', 'white'];
export default { export default {
name: 'van-loading', name: 'van-loading',
props: { props: {
type: { type: {
type: String, type: String,
default: 'gradient-circle', default: 'gradient-circle'
validator: value => VALID_TYPES.indexOf(value) > -1
}, },
color: { color: {
type: String, type: String,
default: 'black', default: 'black'
validator: value => VALID_COLORS.indexOf(value) > -1
} }
} }
}; };

View File

@ -25,8 +25,6 @@
<script> <script>
import Icon from '../icon'; import Icon from '../icon';
const NOTICE_BAR_MODE = ['', 'closeable', 'link'];
export default { export default {
name: 'van-notice-bar', name: 'van-notice-bar',
@ -36,14 +34,10 @@ export default {
props: { props: {
text: String, text: String,
leftIcon: String, mode: String,
color: String, color: String,
leftIcon: String,
background: String, background: String,
mode: {
type: String,
default: '',
validator: val => NOTICE_BAR_MODE.indexOf(val) !== -1
},
delay: { delay: {
type: [String, Number], type: [String, Number],
default: 1 default: 1

View File

@ -2,9 +2,9 @@
<div class="van-panel van-hairline--top-bottom"> <div class="van-panel van-hairline--top-bottom">
<div class="van-panel__header van-hairline--bottom"> <div class="van-panel__header van-hairline--bottom">
<slot name="header"> <slot name="header">
<div class="van-panel__title" v-text="title"></div> <div class="van-panel__title" v-text="title" />
<span class="van-panel__desc" v-if="desc" v-text="desc"></span> <span class="van-panel__desc" v-if="desc" v-text="desc" />
<span class="van-panel__status" v-if="status" v-text="status"></span> <span class="van-panel__status" v-if="status" v-text="status" />
</slot> </slot>
</div> </div>
<div class="van-panel__content"> <div class="van-panel__content">

View File

@ -33,8 +33,8 @@ export default {
mixins: [findParent], mixins: [findParent],
props: { props: {
disabled: Boolean,
value: {}, value: {},
disabled: Boolean,
name: [String, Number] name: [String, Number]
}, },

View File

@ -1,5 +1,5 @@
<template> <template>
<div :class="`${prefix}-row`" :style="style"> <div class="van-row" :style="style">
<slot></slot> <slot></slot>
</div> </div>
</template> </template>
@ -9,10 +9,6 @@ export default {
name: 'van-row', name: 'van-row',
props: { props: {
prefix: {
type: String,
default: 'van'
},
gutter: { gutter: {
type: [Number, String], type: [Number, String],
default: 0 default: 0

View File

@ -41,11 +41,8 @@ export default {
props: { props: {
value: String, value: String,
showAction: Boolean,
placeholder: String, placeholder: String,
showAction: {
type: Boolean,
default: false
},
background: { background: {
type: String, type: String,
default: '#f2f2f2' default: '#f2f2f2'

View File

@ -116,10 +116,7 @@ export default {
type: Number, type: Number,
default: 0 default: 0
}, },
hideStock: { hideStock: Boolean,
type: Boolean,
default: false
},
showAddCartBtn: { showAddCartBtn: {
type: Boolean, type: Boolean,
default: true default: true

View File

@ -1,13 +1,13 @@
<template> <template>
<div class="van-step van-hairline" :class="stepClass"> <div class="van-step van-hairline" :class="[`van-step--${$parent.direction}`, { [`van-step--${status}`]: status }]">
<div class="van-step__circle-container"> <div class="van-step__circle-container">
<i class="van-step__circle" v-if="status !== 'process'"></i> <i class="van-step__circle" v-if="status !== 'process'" />
<i class="van-icon van-icon-checked" :style="{ color: $parent.activeColor }" v-else></i> <i class="van-icon van-icon-checked" :style="{ color: $parent.activeColor }" v-else />
</div> </div>
<div class="van-step__title" :style="titleStyle"> <div class="van-step__title" :style="titleStyle">
<slot></slot> <slot></slot>
</div> </div>
<div class="van-step__line"></div> <div class="van-step__line" />
</div> </div>
</template> </template>
@ -30,18 +30,11 @@ export default {
return 'process'; return 'process';
} }
}, },
stepClass() {
const status = this.status;
const statusClass = status ? 'van-step--' + status : '';
const directionClass = `van-step--${this.$parent.direction}`;
return [directionClass, statusClass];
},
titleStyle() { titleStyle() {
if (this.status === 'process') { return this.status === 'process' ? {
return { color: this.$parent.activeColor
color: this.$parent.activeColor } : {};
};
}
} }
} }
}; };

View File

@ -3,21 +3,18 @@
<div class="van-steps__status" v-if="title || description"> <div class="van-steps__status" v-if="title || description">
<div class="van-steps__icon" v-if="icon || $slots.icon"> <div class="van-steps__icon" v-if="icon || $slots.icon">
<slot name="icon"> <slot name="icon">
<van-icon :name="icon" :class="iconClass"></van-icon> <van-icon :name="icon" :class="iconClass" />
</slot> </slot>
</div> </div>
<div class="van-steps__message"> <div class="van-steps__message">
<div class="van-steps__message-wrapper"> <div class="van-steps__message-wrapper">
<div class="van-steps__title" v-text="title"></div> <div class="van-steps__title" v-text="title" />
<div class="van-steps__desc" v-text="description"></div> <div class="van-steps__desc" v-text="description" />
</div> </div>
</div> </div>
<slot name="message-extra"> <slot name="message-extra" />
</slot>
</div> </div>
<div class="van-steps__items" :class="{ <div class="van-steps__items" :class="{ 'van-steps__items--alone': !title && !description }">
'van-steps__items--alone': !title && !description
}">
<slot></slot> <slot></slot>
</div> </div>
</div> </div>
@ -34,13 +31,10 @@ export default {
}, },
props: { props: {
active: Number,
icon: String, icon: String,
iconClass: {
type: String,
default: ''
},
title: String, title: String,
active: Number,
iconClass: String,
description: String, description: String,
direction: { direction: {
type: String, type: String,

View File

@ -1,7 +1,7 @@
<template> <template>
<div class="van-submit-bar"> <div class="van-submit-bar">
<div class="van-submit-bar__tip" v-show="tip || $slots.tip"> <div class="van-submit-bar__tip" v-show="tip || $slots.tip">
{{ tip }}<slot name="tip"></slot> {{ tip }}<slot name="tip" />
</div> </div>
<div class="van-submit-bar__bar"> <div class="van-submit-bar__bar">
<div class="van-submit-bar__price"> <div class="van-submit-bar__price">

View File

@ -12,10 +12,7 @@
> >
<slot></slot> <slot></slot>
</div> </div>
<div <div v-else class="van-swipe__track">
v-else
class="van-swipe__track"
>
<slot></slot> <slot></slot>
</div> </div>
<div class="van-swipe__indicators" v-if="showIndicators && count > 1"> <div class="van-swipe__indicators" v-if="showIndicators && count > 1">

View File

@ -1,6 +1,6 @@
<template> <template>
<van-cell :title="title" class="van-switch-cell"> <van-cell :title="title" class="van-switch-cell">
<van-switch :value="value" @input="$emit('input', $event)" :disabled="disabled" :loading="loading" /> <van-switch v-bind="$props" @input="$emit('input', $event)" />
</van-cell> </van-cell>
</template> </template>

View File

@ -3,7 +3,7 @@
<div class="van-switch__node van-hairline-surround"> <div class="van-switch__node van-hairline-surround">
<van-loading v-if="loading" class="van-switch__loading" /> <van-loading v-if="loading" class="van-switch__loading" />
</div> </div>
<div class="van-switch__bg"></div> <div class="van-switch__bg" />
</div> </div>
</template> </template>

View File

@ -1,19 +1,14 @@
<template> <template>
<span :class="['van-tag', 'van-hairline--surround', { [`van-tag--${type}`]: type, 'is-plain': plain, 'is-mark': mark }]"> <span :class="['van-tag', 'van-hairline--surround', { [`van-tag--${type}`]: type, 'van-tag--plain': plain, 'van-tag--mark': mark }]">
<slot></slot> <slot></slot>
</span> </span>
</template> </template>
<script> <script>
const ALLOW_TYPE = ['danger', 'success', 'primary'];
export default { export default {
name: 'van-tag', name: 'van-tag',
props: { props: {
type: { type: String,
type: String,
validator: val => ~ALLOW_TYPE.indexOf(val)
},
mark: Boolean, mark: Boolean,
plain: Boolean plain: Boolean
} }

View File

@ -6,9 +6,9 @@ let instance;
const defaultOptions = { const defaultOptions = {
visible: true, visible: true,
type: 'text', type: 'text',
mask: false,
position: 'middle', position: 'middle',
duration: 3000, duration: 3000,
mask: false,
forbidClick: false, forbidClick: false,
clear: () => { clear: () => {
instance.visible = false; instance.visible = false;

View File

@ -22,7 +22,6 @@
import Icon from '../icon'; import Icon from '../icon';
import Loading from '../loading'; import Loading from '../loading';
const TOAST_TYPES = ['text', 'html', 'loading', 'success', 'fail'];
const DEFAULT_STYLE_LIST = ['success', 'fail', 'loading']; const DEFAULT_STYLE_LIST = ['success', 'fail', 'loading'];
export default { export default {
@ -34,26 +33,16 @@ export default {
}, },
props: { props: {
mask: Boolean,
message: String,
forbidClick: Boolean,
type: { type: {
type: String, type: String,
default: 'text', default: 'text'
validator: value => TOAST_TYPES.indexOf(value) > -1
},
message: {
type: String,
default: ''
},
forbidClick: {
type: Boolean,
default: false
}, },
position: { position: {
type: String, type: String,
default: 'middle' default: 'middle'
},
mask: {
type: Boolean,
default: false
} }
}, },

View File

@ -10,16 +10,12 @@ export default {
name: 'van-uploader', name: 'van-uploader',
props: { props: {
disabled: { disabled: Boolean,
type: Boolean,
default: false
},
beforeRead: Function, beforeRead: Function,
afterRead: Function, afterRead: Function,
resultType: { resultType: {
type: String, type: String,
default: 'dataUrl', default: 'dataUrl'
validator: value => value === 'dataUrl' || value === 'text'
} }
}, },

View File

@ -10,16 +10,11 @@
color: $white; color: $white;
&::after { &::after {
border-color: $gray; border-color: currentColor;
border-radius: 4px; border-radius: 4px;
} }
&.is-plain { &--mark {
background: $white;
color: $gray;
}
&.is-mark {
border-radius: 0 8px 8px 0; border-radius: 0 8px 8px 0;
&::after { &::after {
@ -30,11 +25,7 @@
&--success { &--success {
background: $green; background: $green;
&::after { &.van-tag--plain {
border-color: $green;
}
&.is-plain {
color: $green; color: $green;
} }
} }
@ -42,11 +33,7 @@
&--danger { &--danger {
background: $button-danger-background-color; background: $button-danger-background-color;
&::after { &.van-tag--plain {
border-color: $button-danger-background-color;
}
&.is-plain {
color: $button-danger-background-color; color: $button-danger-background-color;
} }
} }
@ -54,12 +41,13 @@
&--primary { &--primary {
background: $blue; background: $blue;
&::after { &.van-tag--plain {
border-color: $blue;
}
&.is-plain {
color: $blue; color: $blue;
} }
} }
&--plain {
background: $white;
color: $gray;
}
} }

View File

@ -1,6 +1,6 @@
import deepAssign from 'packages/utils/deep-assign'; import deepAssign from 'packages/utils/deep-assign';
describe('DatetimePicker', () => { describe('DeepAssign', () => {
it('basic assign', () => { it('basic assign', () => {
const a = { foo: 0 }; const a = { foo: 0 };
const b = { foo: 0, bar: 1 }; const b = { foo: 0, bar: 1 };

View File

@ -7755,9 +7755,9 @@ validate-npm-package-license@^3.0.1:
spdx-correct "~1.0.0" spdx-correct "~1.0.0"
spdx-expression-parse "~1.0.0" spdx-expression-parse "~1.0.0"
vant-doc@0.3.17: vant-doc@0.3.18:
version "0.3.17" version "0.3.18"
resolved "https://registry.yarnpkg.com/vant-doc/-/vant-doc-0.3.17.tgz#4c3bd5e4a4299926ad3638dc1c1bd28bbb5ac34b" resolved "https://registry.yarnpkg.com/vant-doc/-/vant-doc-0.3.18.tgz#86f94b931767bd1ba3e2c48015446be1729e0976"
dependencies: dependencies:
cheerio "0.22.0" cheerio "0.22.0"
decamelize "^1.2.0" decamelize "^1.2.0"