alighasami/vant
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

chore: use preventDefault util (#4412)

Browse Source
This commit is contained in:
neverland
2019-09-10 17:08:43 +08:00
committed by GitHub
parent 4b0cf5beda
commit f6f696ff73
10 changed files with 57 additions and 151 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/button/README.md
+6 -6
View File
@@ -25,21 +25,21 @@ Vue.use(Button);
```html
<van-button plain type="primary">Primary</van-button>
<van-button plain type="danger">Danger</van-button>
<van-button plain type="info">Danger</van-button>
```
### Hairline
```html
<van-button plain hairline type="primary">Hairline</van-button>
<van-button plain hairline type="danger">Hairline</van-button>
<van-button plain hairline type="info">Hairline</van-button>
```
### Disabled
```html
<van-button disabled type="primary">Diabled</van-button>
<van-button disabled type="danger">Diabled</van-button>
<van-button disabled type="info">Diabled</van-button>
```
### Loading
@@ -47,14 +47,14 @@ Vue.use(Button);
```html
<van-button loading type="primary" />
<van-button loading type="primary" loading-type="spinner" />
<van-button loading type="danger" loading-text="Loading..." />
<van-button loading type="info" loading-text="Loading..." />
```
### Shape
```html
<van-button square type="primary">Square</van-button>
<van-button round type="danger">Round</van-button>
<van-button round type="info">Round</van-button>
```
### Icon
@@ -62,7 +62,7 @@ Vue.use(Button);
```html
<van-button icon="star-o" type="primary" />
<van-button icon="star-o" type="primary">Button</van-button>
<van-button icon="https://img.yzcdn.cn/vant/logo.png" type="danger">Button</van-button>
<van-button icon="https://img.yzcdn.cn/vant/logo.png" type="info">Button</van-button>
```
### Size
src/button/README.zh-CN.md
+6 -6
View File
@@ -29,7 +29,7 @@ Vue.use(Button);
```html
<van-button plain type="primary">朴素按钮</van-button>
<van-button plain type="danger">朴素按钮</van-button>
<van-button plain type="info">朴素按钮</van-button>
```
### 细边框
@@ -38,7 +38,7 @@ Vue.use(Button);
```html
<van-button plain hairline type="primary">细边框按钮</van-button>
<van-button plain hairline type="danger">细边框按钮</van-button>
<van-button plain hairline type="info">细边框按钮</van-button>
```
### 禁用状态
@@ -47,7 +47,7 @@ Vue.use(Button);
```html
<van-button disabled type="primary">禁用状态</van-button>
<van-button disabled type="danger">禁用状态</van-button>
<van-button disabled type="info">禁用状态</van-button>
```
### 加载状态
@@ -57,7 +57,7 @@ Vue.use(Button);
```html
<van-button loading type="primary" />
<van-button loading type="primary" loading-type="spinner" />
<van-button loading type="danger" loading-text="加载中..." />
<van-button loading type="info" loading-text="加载中..." />
```
### 按钮形状
@@ -66,7 +66,7 @@ Vue.use(Button);
```html
<van-button square type="primary">方形按钮</van-button>
<van-button round type="danger">圆形按钮</van-button>
<van-button round type="info">圆形按钮</van-button>
```
### 图标按钮
@@ -76,7 +76,7 @@ Vue.use(Button);
```html
<van-button icon="star-o" type="primary" />
<van-button icon="star-o" type="primary">按钮</van-button>
<van-button icon="https://img.yzcdn.cn/vant/logo.png" type="danger">按钮</van-button>
<van-button icon="https://img.yzcdn.cn/vant/logo.png" type="info">按钮</van-button>
```
### 按钮尺寸
src/button/demo/index.vue
+22 -109
View File
@@ -11,86 +11,34 @@
</demo-block>
<demo-block :title="$t('plain')">
<van-button
plain
type="primary"
:text="$t('plain')"
/>
<van-button
plain
type="danger"
:text="$t('plain')"
/>
<van-button plain type="primary" :text="$t('plain')" />
<van-button plain type="info" :text="$t('plain')" />
</demo-block>
<demo-block :title="$t('hairline')">
<van-button
plain
hairline
type="primary"
:text="$t('hairlineButton')"
/>
<van-button
plain
hairline
type="danger"
:text="$t('hairlineButton')"
/>
<van-button plain hairline type="primary" :text="$t('hairlineButton')" />
<van-button plain hairline type="info" :text="$t('hairlineButton')" />
</demo-block>
<demo-block :title="$t('disabled')">
<van-button
disabled
type="primary"
:text="$t('disabled')"
/>
<van-button
disabled
type="danger"
:text="$t('disabled')"
/>
<van-button disabled type="primary" :text="$t('disabled')" />
<van-button disabled type="info" :text="$t('disabled')" />
</demo-block>
<demo-block :title="$t('loadingStatus')">
<van-button
loading
type="primary"
/>
<van-button
loading
type="primary"
loading-type="spinner"
/>
<van-button
loading
:loading-text="$t('loadingText')"
type="danger"
/>
<van-button loading type="primary" />
<van-button loading type="primary" loading-type="spinner" />
<van-button loading :loading-text="$t('loadingText')" type="info" />
</demo-block>
<demo-block :title="$t('shape')">
<van-button
type="primary"
square
:text="$t('square')"
/>
<van-button
type="danger"
round
:text="$t('round')"
/>
<van-button type="primary" square :text="$t('square')" />
<van-button type="info" round :text="$t('round')" />
</demo-block>
<demo-block :title="$t('icon')">
<van-button
type="primary"
icon="star-o"
/>
<van-button
type="primary"
icon="star-o"
:text="$t('button')"
/>
<van-button type="primary" icon="star-o" />
<van-button type="primary" icon="star-o" :text="$t('button')" />
<van-button
plain
type="primary"
@@ -100,55 +48,20 @@
</demo-block>
<demo-block :title="$t('size')">
<van-button
type="primary"
size="large"
>
{{ $t('large') }}
</van-button>
<van-button
type="primary"
size="normal"
>
{{ $t('normal') }}
</van-button>
<van-button
type="primary"
size="small"
>
{{ $t('small') }}
</van-button>
<van-button
type="primary"
size="mini"
>
{{ $t('mini') }}
</van-button>
<van-button type="primary" size="large">{{ $t('large') }}</van-button>
<van-button type="primary" size="normal">{{ $t('normal') }}</van-button>
<van-button type="primary" size="small">{{ $t('small') }}</van-button>
<van-button type="primary" size="mini">{{ $t('mini') }}</van-button>
</demo-block>
<demo-block :title="$t('router')">
<van-button
:text="$t('urlRoute')"
type="primary"
url="/vant/mobile.html"
/>
<van-button
:text="$t('vueRoute')"
type="primary"
to="index"
/>
<van-button :text="$t('urlRoute')" type="primary" url="/vant/mobile.html" />
<van-button :text="$t('vueRoute')" type="primary" to="index" />
</demo-block>
<demo-block :title="$t('customColor')">
<van-button
color="#7232dd"
:text="$t('customColor')"
/>
<van-button
plain
color="#7232dd"
:text="$t('customColor')"
/>
<van-button color="#7232dd" :text="$t('customColor')" />
<van-button plain color="#7232dd" :text="$t('customColor')" />
</demo-block>
</demo-section>
</template>
@@ -213,7 +126,7 @@ export default {
</script>
<style lang="less">
@import "../../style/var";
@import '../../style/var';
.demo-button {
.van-button {
src/button/test/__snapshots__/demo.spec.js.snap
+6 -14
View File
@@ -5,32 +5,24 @@ exports[`renders demo correctly 1`] = `
<div>
<div class="demo-button-row"><button class="van-button van-button--default van-button--normal"><span class="van-button__text">默认按钮</span></button> <button class="van-button van-button--primary van-button--normal"><span class="van-button__text">主要按钮</span></button> <button class="van-button van-button--info van-button--normal"><span class="van-button__text">信息按钮</span></button></div> <button class="van-button van-button--danger van-button--normal"><span class="van-button__text">危险按钮</span></button> <button class="van-button van-button--warning van-button--normal"><span class="van-button__text">警告按钮</span></button>
</div>
<div><button class="van-button van-button--primary van-button--normal van-button--plain"><span class="van-button__text">朴素按钮</span></button> <button class="van-button van-button--danger van-button--normal van-button--plain"><span class="van-button__text">朴素按钮</span></button></div>
<div><button class="van-button van-button--primary van-button--normal van-button--plain van-button--hairline van-hairline--surround"><span class="van-button__text">细边框按钮</span></button> <button class="van-button van-button--danger van-button--normal van-button--plain van-button--hairline van-hairline--surround"><span class="van-button__text">细边框按钮</span></button></div>
<div><button disabled="disabled" class="van-button van-button--primary van-button--normal van-button--disabled"><span class="van-button__text">禁用状态</span></button> <button disabled="disabled" class="van-button van-button--danger van-button--normal van-button--disabled"><span class="van-button__text">禁用状态</span></button></div>
<div><button class="van-button van-button--primary van-button--normal van-button--plain"><span class="van-button__text">朴素按钮</span></button> <button class="van-button van-button--info van-button--normal van-button--plain"><span class="van-button__text">朴素按钮</span></button></div>
<div><button class="van-button van-button--primary van-button--normal van-button--plain van-button--hairline van-hairline--surround"><span class="van-button__text">细边框按钮</span></button> <button class="van-button van-button--info van-button--normal van-button--plain van-button--hairline van-hairline--surround"><span class="van-button__text">细边框按钮</span></button></div>
<div><button disabled="disabled" class="van-button van-button--primary van-button--normal van-button--disabled"><span class="van-button__text">禁用状态</span></button> <button disabled="disabled" class="van-button van-button--info van-button--normal van-button--disabled"><span class="van-button__text">禁用状态</span></button></div>
<div><button class="van-button van-button--primary van-button--normal">
<div class="van-loading van-loading--circular van-button__loading"><span class="van-loading__spinner van-loading__spinner--circular" style="width: 20px; height: 20px;"><svg viewBox="25 25 50 50" class="van-loading__circular"><circle cx="50" cy="50" r="20" fill="none"></circle></svg></span></div>
</button> <button class="van-button van-button--primary van-button--normal">
<div class="van-loading van-loading--spinner van-button__loading"><span class="van-loading__spinner van-loading__spinner--spinner" style="width: 20px; height: 20px;"><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i></span></div>
</button> <button class="van-button van-button--danger van-button--normal">
</button> <button class="van-button van-button--info van-button--normal">
<div class="van-loading van-loading--circular van-button__loading"><span class="van-loading__spinner van-loading__spinner--circular" style="width: 20px; height: 20px;"><svg viewBox="25 25 50 50" class="van-loading__circular"><circle cx="50" cy="50" r="20" fill="none"></circle></svg></span></div><span class="van-button__text">加载中...</span>
</button></div>
<div><button class="van-button van-button--primary van-button--normal van-button--square"><span class="van-button__text">方形按钮</span></button> <button class="van-button van-button--danger van-button--normal van-button--round"><span class="van-button__text">圆形按钮</span></button></div>
<div><button class="van-button van-button--primary van-button--normal van-button--square"><span class="van-button__text">方形按钮</span></button> <button class="van-button van-button--info van-button--normal van-button--round"><span class="van-button__text">圆形按钮</span></button></div>
<div><button class="van-button van-button--primary van-button--normal"><i class="van-icon van-icon-star-o van-button__icon">
<!----></i></button> <button class="van-button van-button--primary van-button--normal"><i class="van-icon van-icon-star-o van-button__icon">
<!----></i><span class="van-button__text">按钮</span></button> <button class="van-button van-button--primary van-button--normal van-button--plain"><i class="van-icon van-button__icon">
<div class="van-image van-icon__image"><img src="https://img.yzcdn.cn/vant/logo.png" class="van-image__img" style="object-fit: contain;"></div>
<!---->
</i><span class="van-button__text">按钮</span></button></div>
<div><button class="van-button van-button--primary van-button--large"><span class="van-button__text">
大号按钮
</span></button> <button class="van-button van-button--primary van-button--normal"><span class="van-button__text">
普通按钮
</span></button> <button class="van-button van-button--primary van-button--small"><span class="van-button__text">
小型按钮
</span></button> <button class="van-button van-button--primary van-button--mini"><span class="van-button__text">
迷你按钮
</span></button></div>
<div><button class="van-button van-button--primary van-button--large"><span class="van-button__text">大号按钮</span></button> <button class="van-button van-button--primary van-button--normal"><span class="van-button__text">普通按钮</span></button> <button class="van-button van-button--primary van-button--small"><span class="van-button__text">小型按钮</span></button> <button class="van-button van-button--primary van-button--mini"><span class="van-button__text">迷你按钮</span></button></div>
<div><button class="van-button van-button--primary van-button--normal"><span class="van-button__text">URL 跳转</span></button> <button class="van-button van-button--primary van-button--normal"><span class="van-button__text">路由跳转</span></button></div>
<div><button class="van-button van-button--default van-button--normal" style="color: rgb(255, 255, 255); background: rgb(114, 50, 221); border-color: #7232dd;"><span class="van-button__text">自定义颜色</span></button> <button class="van-button van-button--default van-button--normal van-button--plain" style="color: rgb(114, 50, 221); border-color: #7232dd;"><span class="van-button__text">自定义颜色</span></button></div>
</div>