blackteay/vant-weapp
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant-weapp.git synced 2025-04-05 19:41:45 +08:00
Code Issues Projects Releases Wiki Activity

feat(Switch): change loading color when background color change (#2067)

Browse Source
This commit is contained in:
ShuaiKang Zhang 2019-09-20 09:39:19 +08:00 committed by neverland
parent da30b612c4
commit a65d97c2dd
3 changed files with 14 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/common/color.ts
View File

@ -4,3 +4,4 @@ export const WHITE = '#fff';
export const GREEN = '#07c160';
export const ORANGE = '#ff976a';
export const GRAY = '#323233';
export const GRAY_DARK = '#969799';

14
packages/switch/index.ts
View File

@ -1,4 +1,5 @@
import { VantComponent } from '../common/component';
import { BLUE, GRAY_DARK } from '../common/color';
VantComponent({
field: true,
@ -27,15 +28,24 @@ VantComponent({
watch: {
checked(value) {
this.setData({ value });
const loadingColor = this.getLoadingColor(value);
this.setData({ value, loadingColor });
}
},
created() {
this.setData({ value: this.data.checked });
const { checked: value } = this.data;
const loadingColor = this.getLoadingColor(value);
this.setData({ value, loadingColor });
},
methods: {
getLoadingColor(checked) {
const { activeColor, inactiveColor } = this.data;
return checked ? activeColor || BLUE : inactiveColor || GRAY_DARK;
},
onClick() {
const { activeValue, inactiveValue } = this.data;
if (!this.data.disabled && !this.data.loading) {

2
packages/switch/index.wxml
View File

@ -6,6 +6,6 @@
bind:tap="onClick"
>
<view class="van-switch__node node-class">
<van-loading wx:if="{{ loading }}" size="50%" custom-class="van-switch__loading" />
<van-loading wx:if="{{ loading }}" color="{{ loadingColor }}" size="50%" custom-class="van-switch__loading" />
</view>
</view>