mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
Merge branch 'master' into feature/add_test
This commit is contained in:
jiangruowei
commit
b3fb1616c8
2
docs/build/0.js
vendored
2
docs/build/0.js
vendored
File diff suppressed because one or more lines are too long
2
docs/build/1.js
vendored
2
docs/build/1.js
vendored
@ -1 +1 @@
|
||||
webpackJsonp([1],{259:function(e,t,n){n(485);var i=n(0)(n(273),n(426),null,null);e.exports=i.exports},273:function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0});var o=n(30),a=i(o),s=n(367),r=i(s);t.default={data:function(){return{highlights:[],navState:[],data:a.default["zh-CN"],base:"/component"}},components:{MobileNav:r.default}}},275:function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default={props:{group:{type:Array,default:function(){return[]}},base:String},data:function(){return{isOpen:!1}}}},324:function(e,t,n){t=e.exports=n(17)(),t.push([e.i,".side-nav{width:100%;box-sizing:border-box;padding:90px 15px 20px;position:relative;z-index:1}.side-nav .zanui-desc,.side-nav .zanui-title{text-align:center;font-weight:400}.side-nav .zanui-title{font-size:26px;color:#333}.side-nav .zanui-desc{font-size:14px;color:#666;margin-bottom:50px}",""])},338:function(e,t,n){t=e.exports=n(17)(),t.push([e.i,".mobile-nav-group{border-radius:2px;margin-bottom:15px;padding-left:20px;background-color:#fff;box-shadow:0 1px 1px 0 rgba(0,0,0,.1)}.mobile-nav-group li{list-style:none}.mobile-nav-group ul{padding:0;margin:0;overflow:hidden}.mobile-nav-group__title{font-size:16px;color:#333;line-height:56px;position:relative}.mobile-nav-group__title a{color:#333;display:block;border-top:1px solid #e5e5e5}.mobile-nav-group__title .zan-icon-arrow{position:absolute;font-size:12px;line-height:1;top:24px;right:20px}.mobile-nav-group__title--open{color:#999}",""])},367:function(e,t,n){n(499);var i=n(0)(n(275),n(445),null,null);e.exports=i.exports},426:function(e,t){e.exports={render:function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"side-nav"},[n("h1",{staticClass:"zanui-title"},[e._v("Zan UI Wap")]),e._v(" "),n("h2",{staticClass:"zanui-desc"},[e._v("有赞移动wap端组件库")]),e._v(" "),n("div",{staticClass:"mobile-navs"},[e._l(e.data,function(t){return[t.showInMobile?n("div",{staticClass:"mobile-nav-item"},e._l(t.groups,function(t){return n("mobile-nav",{attrs:{group:t,base:e.base}})})):e._e()]})],2)])},staticRenderFns:[]}},445:function(e,t){e.exports={render:function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"mobile-nav-group"},[n("div",{staticClass:"mobile-nav-group__title",class:{"mobile-nav-group__title--open":e.isOpen},on:{click:function(t){e.isOpen=!e.isOpen}}},[e._v("\n "+e._s(e.group.groupName)+"\n ")]),e._v(" "),n("ul",{directives:[{name:"show",rawName:"v-show",value:e.isOpen,expression:"isOpen"}],staticClass:"pure-menu-list"},[e._l(e.group.list,function(t){return[t.disabled?e._e():n("li",{staticClass:"mobile-nav-group__title"},[n("router-link",{attrs:{"active-class":"active",to:e.base+t.path},domProps:{textContent:e._s(t.title)}}),e._v(" "),n("zan-icon",{attrs:{name:"arrow"}})],1)]})],2)])},staticRenderFns:[]}},485:function(e,t,n){var i=n(324);"string"==typeof i&&(i=[[e.i,i,""]]),i.locals&&(e.exports=i.locals);n(31)("1517d9c0",i,!0)},499:function(e,t,n){var i=n(338);"string"==typeof i&&(i=[[e.i,i,""]]),i.locals&&(e.exports=i.locals);n(31)("8bcdd7d6",i,!0)}});
|
||||
webpackJsonp([1],{259:function(e,t,n){n(490);var i=n(0)(n(273),n(431),null,null);e.exports=i.exports},273:function(e,t,n){"use strict";function i(e){return e&&e.__esModule?e:{default:e}}Object.defineProperty(t,"__esModule",{value:!0});var o=n(30),a=i(o),s=n(372),r=i(s);t.default={data:function(){return{highlights:[],navState:[],data:a.default["zh-CN"],base:"/component"}},components:{MobileNav:r.default}}},275:function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0}),t.default={props:{group:{type:Object,default:function(){return[]}},base:String},data:function(){return{isOpen:!1}}}},325:function(e,t,n){t=e.exports=n(18)(),t.push([e.i,".side-nav{width:100%;box-sizing:border-box;padding:90px 15px 20px;position:relative;z-index:1}.side-nav .zanui-desc,.side-nav .zanui-title{text-align:center;font-weight:400}.side-nav .zanui-title{font-size:26px;color:#333}.side-nav .zanui-desc{font-size:14px;color:#666;margin-bottom:50px}",""])},341:function(e,t,n){t=e.exports=n(18)(),t.push([e.i,".mobile-nav-group{border-radius:2px;margin-bottom:15px;padding-left:20px;background-color:#fff;box-shadow:0 1px 1px 0 rgba(0,0,0,.1)}.mobile-nav-group li{list-style:none}.mobile-nav-group ul{padding:0;margin:0;overflow:hidden}.mobile-nav-group__title{font-size:16px;color:#333;line-height:56px;position:relative}.mobile-nav-group__title a{color:#333;display:block;border-top:1px solid #e5e5e5}.mobile-nav-group__title .zan-icon-arrow{position:absolute;font-size:12px;line-height:1;top:24px;right:20px}.mobile-nav-group__title--open{color:#999}",""])},372:function(e,t,n){n(506);var i=n(0)(n(275),n(450),null,null);e.exports=i.exports},431:function(e,t){e.exports={render:function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"side-nav"},[n("h1",{staticClass:"zanui-title"},[e._v("Zan UI Wap")]),e._v(" "),n("h2",{staticClass:"zanui-desc"},[e._v("有赞移动wap端组件库")]),e._v(" "),n("div",{staticClass:"mobile-navs"},[e._l(e.data,function(t){return[t.showInMobile?n("div",{staticClass:"mobile-nav-item"},e._l(t.groups,function(t){return n("mobile-nav",{attrs:{group:t,base:e.base}})})):e._e()]})],2)])},staticRenderFns:[]}},450:function(e,t){e.exports={render:function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"mobile-nav-group"},[n("div",{staticClass:"mobile-nav-group__title",class:{"mobile-nav-group__title--open":e.isOpen},on:{click:function(t){e.isOpen=!e.isOpen}}},[e._v("\n "+e._s(e.group.groupName)+"\n ")]),e._v(" "),n("ul",{directives:[{name:"show",rawName:"v-show",value:e.isOpen,expression:"isOpen"}],staticClass:"pure-menu-list"},[e._l(e.group.list,function(t){return[t.disabled?e._e():n("li",{staticClass:"mobile-nav-group__title"},[n("router-link",{attrs:{"active-class":"active",to:e.base+t.path},domProps:{textContent:e._s(t.title)}}),e._v(" "),n("zan-icon",{attrs:{name:"arrow"}})],1)]})],2)])},staticRenderFns:[]}},490:function(e,t,n){var i=n(325);"string"==typeof i&&(i=[[e.i,i,""]]),i.locals&&(e.exports=i.locals);n(31)("1517d9c0",i,!0)},506:function(e,t,n){var i=n(341);"string"==typeof i&&(i=[[e.i,i,""]]),i.locals&&(e.exports=i.locals);n(31)("8bcdd7d6",i,!0)}});
|
||||
2
docs/build/zanui-docs.js
vendored
2
docs/build/zanui-docs.js
vendored
File diff suppressed because one or more lines are too long
2
docs/build/zanui-examples.js
vendored
2
docs/build/zanui-examples.js
vendored
File diff suppressed because one or more lines are too long
@ -29,7 +29,7 @@
|
||||
export default {
|
||||
props: {
|
||||
group: {
|
||||
type: Array,
|
||||
type: Object,
|
||||
default: () => {
|
||||
return [];
|
||||
}
|
||||
|
||||
@ -4,7 +4,15 @@
|
||||
|
||||
|
||||
</example-block></section></template>
|
||||
|
||||
<style>
|
||||
@component-namespace demo {
|
||||
@b image-preview {
|
||||
.zan-button {
|
||||
margin-left: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
import Vue from "vue";import ExampleBlock from "../components/example-block";Vue.component("example-block", ExampleBlock);
|
||||
import { ImagePreview } from 'src/index';
|
||||
|
||||
@ -55,7 +55,10 @@
|
||||
|
||||
.zan-popup-4 {
|
||||
width: 60%;
|
||||
height: 200px;
|
||||
box-sizing: border-box;
|
||||
padding: 20px;
|
||||
border-radius: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.zan-button {
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template><section class="demo-switch"><h1 class="demo-title">switch</h1><example-block title="基础用法">
|
||||
<div class="demo-switch__wrapper">
|
||||
<zan-switch class="some-customized-class" :checked="switchState" :on-change="updateState"></zan-switch>
|
||||
<zan-switch class="some-customized-class" :checked="switchState" @change="updateState"></zan-switch>
|
||||
<div class="demo-switch__text">{{switchStateText}}</div>
|
||||
</div>
|
||||
<div class="demo-switch__wrapper">
|
||||
@ -41,4 +41,22 @@
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
import Vue from "vue";import ExampleBlock from "../components/example-block";Vue.component("example-block", ExampleBlock);</script>
|
||||
import Vue from "vue";import ExampleBlock from "../components/example-block";Vue.component("example-block", ExampleBlock);
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
switchState: true
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
switchStateText() {
|
||||
return this.switchState ? ' ON' : 'OFF';
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
updateState(newState) {
|
||||
this.switchState = newState;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -38,6 +38,15 @@
|
||||
|
||||
</example-block></section></template>
|
||||
<style>
|
||||
@component-namespace demo {
|
||||
@b tab {
|
||||
.zan-tabs-pane {
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style><style>
|
||||
.page-tab {
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
<template><section class="demo-toast"><h1 class="demo-title">toast</h1><example-block title="基础用法">
|
||||
<zan-button @click="showSimpleToast()">普通文字提示</zan-button>
|
||||
|
||||
<zan-button @click="showToast('loading')">加载Toast</zan-button>
|
||||
<zan-button @click="showToast('success')">成功</zan-button>
|
||||
<zan-button @click="showToast('failure')">失败</zan-button>
|
||||
<zan-button @click="showSimpleToast">普通文字提示</zan-button>
|
||||
<zan-button @click="showLoadingToast">加载Toast</zan-button>
|
||||
<zan-button @click="showSuccessToast">成功</zan-button>
|
||||
<zan-button @click="showFailToast">失败</zan-button>
|
||||
<zan-button @click="showCustomizedToast(5000)">倒数5秒</zan-button>
|
||||
|
||||
|
||||
|
||||
@ -26,11 +26,30 @@ export default {
|
||||
showSimpleToast() {
|
||||
Toast('我是提示文案，建议不超过十五字~');
|
||||
},
|
||||
showToast(type) {
|
||||
Toast({
|
||||
type: type,
|
||||
message: '文案信息'
|
||||
})
|
||||
showLoadingToast() {
|
||||
Toast.loading();
|
||||
},
|
||||
showSuccessToast() {
|
||||
Toast.success('成功文案');
|
||||
},
|
||||
showFailToast() {
|
||||
Toast.fail('失败文案');
|
||||
},
|
||||
showCustomizedToast(duration) {
|
||||
let leftSec = duration / 1000;
|
||||
let toast = Toast({
|
||||
duration: duration + 1000,
|
||||
type: 'success',
|
||||
message: leftSec.toString()
|
||||
});
|
||||
window.setInterval(() => {
|
||||
if (leftSec <= 1) {
|
||||
window.clearInterval();
|
||||
toast.message = '跳转中...'
|
||||
return;
|
||||
}
|
||||
toast.message = (--leftSec).toString();
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
</example-block><example-block title="自定义上传图标">
|
||||
<div class="uploader-container">
|
||||
<zan-uploader @file-readed="logContent">
|
||||
<zan-icon name="camera"></zan-icon>
|
||||
<zan-icon name="photograph"></zan-icon>
|
||||
</zan-uploader>
|
||||
</div>
|
||||
|
||||
|
||||
@ -1,3 +1,13 @@
|
||||
<style>
|
||||
@component-namespace demo {
|
||||
@b image-preview {
|
||||
.zan-button {
|
||||
margin-left: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
import { ImagePreview } from 'src/index';
|
||||
|
||||
|
||||
@ -22,7 +22,10 @@
|
||||
|
||||
.zan-popup-4 {
|
||||
width: 60%;
|
||||
height: 200px;
|
||||
box-sizing: border-box;
|
||||
padding: 20px;
|
||||
border-radius: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.zan-button {
|
||||
|
||||
@ -16,6 +16,25 @@
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
switchState: true
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
switchStateText() {
|
||||
return this.switchState ? ' ON' : 'OFF';
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
updateState(newState) {
|
||||
this.switchState = newState;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
## Switch组件
|
||||
|
||||
@ -24,7 +43,7 @@
|
||||
:::demo 基础用法
|
||||
```html
|
||||
<div class="demo-switch__wrapper">
|
||||
<zan-switch class="some-customized-class" :checked="switchState" :on-change="updateState"></zan-switch>
|
||||
<zan-switch class="some-customized-class" :checked="switchState" @change="updateState"></zan-switch>
|
||||
<div class="demo-switch__text">{{switchStateText}}</div>
|
||||
</div>
|
||||
<div class="demo-switch__wrapper">
|
||||
@ -73,4 +92,3 @@ export default {
|
||||
| checked | 开关状态 | boolean | false | true, false |
|
||||
| loading | loading状态 | boolean | false | true, false |
|
||||
| disabled | 禁用状态 | boolean | false | true, false |
|
||||
| onChange | 回调 | function | function（）{} | - |
|
||||
|
||||
@ -1,3 +1,14 @@
|
||||
<style>
|
||||
@component-namespace demo {
|
||||
@b tab {
|
||||
.zan-tabs-pane {
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
## Tab 组件
|
||||
|
||||
### 基础用法
|
||||
|
||||
@ -16,11 +16,30 @@ export default {
|
||||
showSimpleToast() {
|
||||
Toast('我是提示文案，建议不超过十五字~');
|
||||
},
|
||||
showToast(type) {
|
||||
Toast({
|
||||
type: type,
|
||||
message: '文案信息'
|
||||
})
|
||||
showLoadingToast() {
|
||||
Toast.loading();
|
||||
},
|
||||
showSuccessToast() {
|
||||
Toast.success('成功文案');
|
||||
},
|
||||
showFailToast() {
|
||||
Toast.fail('失败文案');
|
||||
},
|
||||
showCustomizedToast(duration) {
|
||||
let leftSec = duration / 1000;
|
||||
let toast = Toast({
|
||||
duration: duration + 1000,
|
||||
type: 'success',
|
||||
message: leftSec.toString()
|
||||
});
|
||||
window.setInterval(() => {
|
||||
if (leftSec <= 1) {
|
||||
window.clearInterval();
|
||||
toast.message = '跳转中...'
|
||||
return;
|
||||
}
|
||||
toast.message = (--leftSec).toString();
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
};
|
||||
@ -32,11 +51,11 @@ export default {
|
||||
|
||||
:::demo 基础用法
|
||||
```html
|
||||
<zan-button @click="showSimpleToast()">普通文字提示</zan-button>
|
||||
|
||||
<zan-button @click="showToast('loading')">加载Toast</zan-button>
|
||||
<zan-button @click="showToast('success')">成功</zan-button>
|
||||
<zan-button @click="showToast('failure')">失败</zan-button>
|
||||
<zan-button @click="showSimpleToast">普通文字提示</zan-button>
|
||||
<zan-button @click="showLoadingToast">加载Toast</zan-button>
|
||||
<zan-button @click="showSuccessToast">成功</zan-button>
|
||||
<zan-button @click="showFailToast">失败</zan-button>
|
||||
<zan-button @click="showCustomizedToast(5000)">倒数5秒</zan-button>
|
||||
|
||||
<script>
|
||||
import { Toast } from 'src/index';
|
||||
@ -46,11 +65,30 @@ export default {
|
||||
showSimpleToast() {
|
||||
Toast('我是提示文案，建议不超过十五字~');
|
||||
},
|
||||
showToast(type) {
|
||||
Toast({
|
||||
type: type,
|
||||
message: '文案信息'
|
||||
})
|
||||
showLoadingToast() {
|
||||
Toast.loading();
|
||||
},
|
||||
showSuccessToast() {
|
||||
Toast.success('成功文案');
|
||||
},
|
||||
showFailToast() {
|
||||
Toast.fail('失败文案');
|
||||
},
|
||||
showCustomizedToast(duration) {
|
||||
let leftSec = duration / 1000;
|
||||
let toast = Toast({
|
||||
duration: duration + 1000,
|
||||
type: 'success',
|
||||
message: leftSec.toString()
|
||||
});
|
||||
window.setInterval(() => {
|
||||
if (leftSec <= 1) {
|
||||
window.clearInterval();
|
||||
toast.message = '跳转中...'
|
||||
return;
|
||||
}
|
||||
toast.message = (--leftSec).toString();
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
};
|
||||
@ -58,7 +96,6 @@ export default {
|
||||
```
|
||||
:::
|
||||
|
||||
|
||||
### API
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|
||||
|
||||
@ -31,7 +31,7 @@ export default {
|
||||
```html
|
||||
<div class="uploader-container">
|
||||
<zan-uploader @file-readed="logContent">
|
||||
<zan-icon name="camera"></zan-icon>
|
||||
<zan-icon name="photograph"></zan-icon>
|
||||
</zan-uploader>
|
||||
</div>
|
||||
```
|
||||
|
||||
@ -16,7 +16,6 @@ import ZanLoading from 'packages/loading';
|
||||
* @param {boolean} [checked=false] - 开关状态
|
||||
* @param {boolean} [disabled=false] - 禁用
|
||||
* @param {boolean} [loading=false] - loading状态
|
||||
* @param {callback} [onChange] - 开关状态改变回调函数。
|
||||
*
|
||||
* @example
|
||||
* <zan-switch checked="true" disabled="false"></zan-switch>
|
||||
@ -38,10 +37,6 @@ export default {
|
||||
loading: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
onChange: {
|
||||
type: Function,
|
||||
default: function() {}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@ -58,7 +53,7 @@ export default {
|
||||
*/
|
||||
toggleState: function() {
|
||||
if (this.disabled || this.loading) return;
|
||||
this.onChange(!this.checked);
|
||||
this.$emit('change', !this.checked);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
import Vue from 'vue';
|
||||
import merge from 'src/utils/merge';
|
||||
|
||||
const ToastConstructor = Vue.extend(require('./toast.vue'));
|
||||
let toastQueue = [];
|
||||
@ -50,4 +51,26 @@ var Toast = (options = {}) => {
|
||||
return instance;
|
||||
};
|
||||
|
||||
Toast.loading = (options) => {
|
||||
return new Toast(merge({
|
||||
type: 'loading'
|
||||
}, options));
|
||||
};
|
||||
|
||||
Toast.success = (options) => {
|
||||
const message = typeof options === 'string' ? options : options.message;
|
||||
return new Toast(merge({
|
||||
type: 'success',
|
||||
message: message
|
||||
}, options));
|
||||
};
|
||||
|
||||
Toast.fail = (options) => {
|
||||
const message = typeof options === 'string' ? options : options.message;
|
||||
return new Toast(merge({
|
||||
type: 'fail',
|
||||
message: message
|
||||
}, options));
|
||||
};
|
||||
|
||||
export default Toast;
|
||||
|
||||
@ -22,7 +22,7 @@
|
||||
import zanLoading from 'packages/loading';
|
||||
import zanIcon from 'packages/icon';
|
||||
|
||||
const TOAST_TYPES = ['text', 'loading', 'success', 'failure'];
|
||||
const TOAST_TYPES = ['text', 'loading', 'success', 'fail'];
|
||||
/**
|
||||
* zan-toast
|
||||
* @module components/toast
|
||||
@ -50,7 +50,7 @@ export default {
|
||||
type: String,
|
||||
default: '',
|
||||
validate(value) {
|
||||
if (this.type === 'success' || this.type === 'failure') {
|
||||
if (this.type === 'success' || this.type === 'fail') {
|
||||
return value.length <= 16;
|
||||
}
|
||||
}
|
||||
|
||||
@ -66,12 +66,14 @@
|
||||
padding: 1px;
|
||||
border: 1px solid $c-gray-dark;
|
||||
border-width: 1px 0;
|
||||
border-radius: 0;
|
||||
box-sizing: content-box;
|
||||
color: $c-gray-darker;
|
||||
font-size: 14px;
|
||||
outline: 0;
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -19,7 +19,8 @@
|
||||
}
|
||||
|
||||
@m text {
|
||||
padding: 11px;
|
||||
padding: 12px;
|
||||
min-width: 200px;
|
||||
}
|
||||
|
||||
@m default {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user