mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
[improvement] Cell: functional (#2729)
This commit is contained in:
neverland
GitHub
parent
a08666947f
commit
4aad9add9c
@ -4,19 +4,19 @@ exports[`renders demo correctly 1`] = `
|
||||
<div>
|
||||
<div>
|
||||
<div class="van-address-edit">
|
||||
<div placeholder="收货人姓名" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>姓名</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="text" placeholder="收货人姓名" value="" class="van-field__control"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div placeholder="收货人手机号" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>电话</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="tel" placeholder="收货人手机号" value="" class="van-field__control"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div placeholder="选择省 / 市 / 区" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>地区</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="text" placeholder="选择省 / 市 / 区" readonly="readonly" value="" class="van-field__control"></div>
|
||||
@ -24,7 +24,7 @@ exports[`renders demo correctly 1`] = `
|
||||
</div>
|
||||
<div class="van-cell van-address-edit-detail">
|
||||
<div class="van-cell__value van-cell__value--alone">
|
||||
<div rows="1" maxlength="200" placeholder="街道门牌、楼层房间号等信息" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>详细地址</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><textarea rows="1" maxlength="200" placeholder="街道门牌、楼层房间号等信息" class="van-field__control"></textarea></div>
|
||||
@ -32,7 +32,7 @@ exports[`renders demo correctly 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div maxlength="6" placeholder="邮政编码" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>邮政编码</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="tel" maxlength="6" placeholder="邮政编码" value="" class="van-field__control"></div>
|
||||
|
||||
@ -2,19 +2,19 @@
|
||||
|
||||
exports[`create a AddressEdit 1`] = `
|
||||
<div class="van-address-edit">
|
||||
<div placeholder="收货人姓名" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>姓名</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="text" placeholder="收货人姓名" value="" class="van-field__control"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div placeholder="收货人手机号" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>电话</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="tel" placeholder="收货人手机号" value="" class="van-field__control"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div placeholder="选择省 / 市 / 区" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>地区</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="text" placeholder="选择省 / 市 / 区" readonly="readonly" value="" class="van-field__control"></div>
|
||||
@ -22,7 +22,7 @@ exports[`create a AddressEdit 1`] = `
|
||||
</div>
|
||||
<div class="van-cell van-address-edit-detail">
|
||||
<div class="van-cell__value van-cell__value--alone">
|
||||
<div rows="1" maxlength="200" placeholder="街道门牌、楼层房间号等信息" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>详细地址</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><textarea rows="1" maxlength="200" placeholder="街道门牌、楼层房间号等信息" class="van-field__control"></textarea></div>
|
||||
@ -59,19 +59,19 @@ exports[`create a AddressEdit 1`] = `
|
||||
|
||||
exports[`create a AddressEdit with props 1`] = `
|
||||
<div class="van-address-edit">
|
||||
<div placeholder="收货人姓名" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>姓名</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="text" placeholder="收货人姓名" value="测试" class="van-field__control"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div placeholder="收货人手机号" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>电话</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="tel" placeholder="收货人手机号" value="13000000000" class="van-field__control"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div placeholder="选择省 / 市 / 区" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>地区</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="text" placeholder="选择省 / 市 / 区" readonly="readonly" value="北京市/朝阳区" class="van-field__control"></div>
|
||||
@ -79,7 +79,7 @@ exports[`create a AddressEdit with props 1`] = `
|
||||
</div>
|
||||
<div class="van-cell van-address-edit-detail">
|
||||
<div class="van-cell__value van-cell__value--alone">
|
||||
<div rows="1" maxlength="200" placeholder="街道门牌、楼层房间号等信息" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>详细地址</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><textarea rows="1" maxlength="200" placeholder="街道门牌、楼层房间号等信息" class="van-field__control">详细地址</textarea></div>
|
||||
@ -87,7 +87,7 @@ exports[`create a AddressEdit with props 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div maxlength="6" placeholder="邮政编码" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>邮政编码</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="tel" maxlength="6" placeholder="邮政编码" value="10000" class="van-field__control"></div>
|
||||
|
||||
@ -1,69 +1,83 @@
|
||||
import { use, isDef } from '../utils';
|
||||
import { cellProps } from './shared';
|
||||
import { emit, inherit, unifySlots } from '../utils/functional';
|
||||
import { routeProps, functionalRoute } from '../mixins/router-link';
|
||||
import Icon from '../icon';
|
||||
import CellMixin from '../mixins/cell';
|
||||
import RouterLink from '../mixins/router-link';
|
||||
|
||||
const [sfc, bem] = use('cell');
|
||||
|
||||
export default sfc({
|
||||
mixins: [CellMixin, RouterLink],
|
||||
functional: true,
|
||||
|
||||
props: {
|
||||
...cellProps,
|
||||
...routeProps,
|
||||
size: String,
|
||||
clickable: Boolean,
|
||||
arrowDirection: String
|
||||
},
|
||||
|
||||
methods: {
|
||||
onClick() {
|
||||
this.$emit('click');
|
||||
this.routerLink();
|
||||
}
|
||||
},
|
||||
render(h, context) {
|
||||
const slots = unifySlots(context);
|
||||
const { props } = context;
|
||||
const { icon, size, title, label, value, isLink, arrowDirection } = props;
|
||||
|
||||
render(h) {
|
||||
const { slots } = this;
|
||||
const showTitle = slots('title') || isDef(this.title);
|
||||
const showValue = slots() || isDef(this.value);
|
||||
const showTitle = slots.title || isDef(title);
|
||||
const showValue = slots.default || isDef(value);
|
||||
|
||||
const Title = showTitle && (
|
||||
<div class={[bem('title'), this.titleClass]}>
|
||||
{slots('title') || <span>{this.title}</span>}
|
||||
{this.label && <div class={[bem('label'), this.labelClass]}>{this.label}</div>}
|
||||
<div class={[bem('title'), props.titleClass]}>
|
||||
{slots.title ? slots.title() : <span>{title}</span>}
|
||||
{label && <div class={[bem('label'), props.labelClass]}>{label}</div>}
|
||||
</div>
|
||||
);
|
||||
|
||||
const Value = showValue && (
|
||||
<div class={[bem('value', { alone: !slots('title') && !this.title }), this.valueClass]}>
|
||||
{slots() || <span>{this.value}</span>}
|
||||
<div
|
||||
class={[
|
||||
bem('value', { alone: !slots.title && !title }),
|
||||
props.valueClass
|
||||
]}
|
||||
>
|
||||
{slots.default ? slots.default() : <span>{value}</span>}
|
||||
</div>
|
||||
);
|
||||
|
||||
const LeftIcon = slots('icon') || (
|
||||
this.icon && <Icon class={bem('left-icon')} name={this.icon} />
|
||||
const LeftIcon = slots.icon
|
||||
? slots.icon()
|
||||
: icon && <Icon class={bem('left-icon')} name={icon} />;
|
||||
|
||||
const RightIcon = slots['right-icon']
|
||||
? slots['right-icon']()
|
||||
: isLink && (
|
||||
<Icon
|
||||
class={bem('right-icon')}
|
||||
name={arrowDirection ? `arrow-${arrowDirection}` : 'arrow'}
|
||||
/>
|
||||
);
|
||||
|
||||
const arrowIcon = this.arrowDirection ? `arrow-${this.arrowDirection}` : 'arrow';
|
||||
const RightIcon = slots('right-icon') || (
|
||||
this.isLink && <Icon class={bem('right-icon')} name={arrowIcon} />
|
||||
);
|
||||
const onClick = event => {
|
||||
emit(context, 'click', event);
|
||||
functionalRoute(context);
|
||||
};
|
||||
|
||||
return (
|
||||
<div
|
||||
class={bem({
|
||||
center: this.center,
|
||||
required: this.required,
|
||||
borderless: !this.border,
|
||||
clickable: this.isLink || this.clickable,
|
||||
[this.size]: this.size
|
||||
center: props.center,
|
||||
required: props.required,
|
||||
borderless: !props.border,
|
||||
clickable: isLink || props.clickable,
|
||||
[size]: size
|
||||
})}
|
||||
onClick={this.onClick}
|
||||
onClick={onClick}
|
||||
{...inherit(context)}
|
||||
>
|
||||
{LeftIcon}
|
||||
{Title}
|
||||
{Value}
|
||||
{RightIcon}
|
||||
{slots('extra')}
|
||||
{slots.extra && slots.extra()}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
16
packages/cell/shared.ts
Normal file
16
packages/cell/shared.ts
Normal file
@ -0,0 +1,16 @@
|
||||
export const cellProps = {
|
||||
icon: String,
|
||||
center: Boolean,
|
||||
isLink: Boolean,
|
||||
required: Boolean,
|
||||
titleClass: String,
|
||||
valueClass: String,
|
||||
labelClass: String,
|
||||
title: [String, Number],
|
||||
value: [String, Number],
|
||||
label: [String, Number],
|
||||
border: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
};
|
||||
@ -2,8 +2,15 @@ import Cell from '..';
|
||||
import { mount } from '../../../test/utils';
|
||||
|
||||
test('click event', () => {
|
||||
const wrapper = mount(Cell);
|
||||
const click = jest.fn();
|
||||
const wrapper = mount(Cell, {
|
||||
context: {
|
||||
on: {
|
||||
click
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.trigger('click');
|
||||
expect(wrapper.emitted('click')).toBeTruthy();
|
||||
expect(click.mock.calls.length).toBeTruthy();
|
||||
});
|
||||
|
||||
@ -1,16 +1,17 @@
|
||||
import { use, isDef } from '../utils';
|
||||
import { raf } from '../utils/raf';
|
||||
import Cell from '../cell';
|
||||
import CellMixin from '../mixins/cell';
|
||||
import { cellProps } from '../cell/shared';
|
||||
import FindParent from '../mixins/find-parent';
|
||||
|
||||
const [sfc, bem] = use('collapse-item');
|
||||
const CELL_SLOTS = ['title', 'icon', 'right-icon'];
|
||||
|
||||
export default sfc({
|
||||
mixins: [CellMixin, FindParent],
|
||||
mixins: [FindParent],
|
||||
|
||||
props: {
|
||||
...cellProps,
|
||||
name: [String, Number],
|
||||
disabled: Boolean,
|
||||
isLink: {
|
||||
|
||||
@ -25,13 +25,13 @@ exports[`renders demo correctly 1`] = `
|
||||
</div>
|
||||
<div name="van-popup-slide-bottom" class="van-popup van-popup--bottom" style="display:none;">
|
||||
<div class="van-contact-edit">
|
||||
<div maxlength="30" placeholder="请填写姓名" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>张三</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="text" maxlength="30" placeholder="请填写姓名" value="" class="van-field__control"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div placeholder="请填写电话" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>电话</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="tel" placeholder="请填写电话" value="" class="van-field__control"></div>
|
||||
|
||||
@ -15,13 +15,13 @@ exports[`renders demo correctly 1`] = `
|
||||
</span></button>
|
||||
<div name="van-dialog-bounce" class="van-dialog" style="display:none;">
|
||||
<div class="van-dialog__content">
|
||||
<div placeholder="请输入用户名" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>用户名</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="text" placeholder="请输入用户名" value="" class="van-field__control"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div placeholder="请输入密码" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>密码</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="password" placeholder="请输入密码" value="" class="van-field__control"></div>
|
||||
|
||||
@ -1,16 +1,15 @@
|
||||
import { use, isObj, isDef } from '../utils';
|
||||
import Icon from '../icon';
|
||||
import Cell from '../cell';
|
||||
import CellMixin from '../mixins/cell';
|
||||
import { cellProps } from '../cell/shared';
|
||||
|
||||
const [sfc, bem] = use('field');
|
||||
|
||||
export default sfc({
|
||||
inheritAttrs: false,
|
||||
|
||||
mixins: [CellMixin],
|
||||
|
||||
props: {
|
||||
...cellProps,
|
||||
error: Boolean,
|
||||
leftIcon: String,
|
||||
rightIcon: String,
|
||||
|
||||
@ -4,7 +4,7 @@ exports[`renders demo correctly 1`] = `
|
||||
<div>
|
||||
<div>
|
||||
<div class="van-cell-group van-hairline--top-bottom">
|
||||
<div placeholder="请输入用户名" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__value van-cell__value--alone">
|
||||
<div class="van-field__body"><input type="text" placeholder="请输入用户名" value="" class="van-field__control"></div>
|
||||
</div>
|
||||
@ -13,7 +13,7 @@ exports[`renders demo correctly 1`] = `
|
||||
</div>
|
||||
<div>
|
||||
<div class="van-cell-group van-hairline--top-bottom">
|
||||
<div placeholder="请输入用户名" class="van-cell van-cell--required van-field">
|
||||
<div class="van-cell van-cell--required van-field">
|
||||
<div class="van-cell__title van-field__label"><span>用户名</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="text" placeholder="请输入用户名" value="" class="van-field__control">
|
||||
@ -22,7 +22,7 @@ exports[`renders demo correctly 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div placeholder="请输入密码" class="van-cell van-cell--required van-field">
|
||||
<div class="van-cell van-cell--required van-field">
|
||||
<div class="van-cell__title van-field__label"><span>密码</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="password" placeholder="请输入密码" value="" class="van-field__control"></div>
|
||||
@ -32,7 +32,7 @@ exports[`renders demo correctly 1`] = `
|
||||
</div>
|
||||
<div>
|
||||
<div class="van-cell-group van-hairline--top-bottom">
|
||||
<div disabled="disabled" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-field__left-icon"><i class="van-icon van-icon-contact">
|
||||
<!----></i></div>
|
||||
<div class="van-cell__title van-field__label"><span>用户名</span></div>
|
||||
@ -44,13 +44,13 @@ exports[`renders demo correctly 1`] = `
|
||||
</div>
|
||||
<div>
|
||||
<div class="van-cell-group van-hairline--top-bottom">
|
||||
<div placeholder="请输入用户名" class="van-cell van-field van-field--error">
|
||||
<div class="van-cell van-field van-field--error">
|
||||
<div class="van-cell__title van-field__label"><span>用户名</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="text" placeholder="请输入用户名" value="" class="van-field__control"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div placeholder="请输入手机号" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>手机号</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="text" placeholder="请输入手机号" value="1365577" class="van-field__control"></div>
|
||||
@ -61,7 +61,7 @@ exports[`renders demo correctly 1`] = `
|
||||
</div>
|
||||
<div>
|
||||
<div class="van-cell-group van-hairline--top-bottom">
|
||||
<div placeholder="请输入留言" rows="1" class="van-cell van-field">
|
||||
<div class="van-cell van-field">
|
||||
<div class="van-cell__title van-field__label"><span>留言</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><textarea placeholder="请输入留言" rows="1" class="van-field__control"></textarea></div>
|
||||
@ -71,7 +71,7 @@ exports[`renders demo correctly 1`] = `
|
||||
</div>
|
||||
<div>
|
||||
<div class="van-cell-group van-hairline--top-bottom">
|
||||
<div placeholder="请输入短信验证码" class="van-cell van-cell--center van-field">
|
||||
<div class="van-cell van-cell--center van-field">
|
||||
<div class="van-cell__title van-field__label"><span>短信验证码</span></div>
|
||||
<div class="van-cell__value">
|
||||
<div class="van-field__body"><input type="text" placeholder="请输入短信验证码" value="" class="van-field__control">
|
||||
|
||||
@ -1,13 +1,12 @@
|
||||
import { use } from '../utils';
|
||||
import Button from '../button';
|
||||
import RouterLink from '../mixins/router-link';
|
||||
import { route, routeProps } from '../mixins/router-link';
|
||||
|
||||
const [sfc, bem] = use('goods-action-big-btn');
|
||||
|
||||
export default sfc({
|
||||
mixins: [RouterLink],
|
||||
|
||||
props: {
|
||||
...routeProps,
|
||||
text: String,
|
||||
primary: Boolean,
|
||||
loading: Boolean,
|
||||
@ -17,7 +16,7 @@ export default sfc({
|
||||
methods: {
|
||||
onClick(event) {
|
||||
this.$emit('click', event);
|
||||
this.routerLink();
|
||||
route(this.$router, this);
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@ -1,13 +1,12 @@
|
||||
import { use } from '../utils';
|
||||
import Icon from '../icon';
|
||||
import RouterLink from '../mixins/router-link';
|
||||
import { route, routeProps } from '../mixins/router-link';
|
||||
|
||||
const [sfc, bem] = use('goods-action-mini-btn');
|
||||
|
||||
export default sfc({
|
||||
mixins: [RouterLink],
|
||||
|
||||
props: {
|
||||
...routeProps,
|
||||
text: String,
|
||||
info: [String, Number],
|
||||
icon: String,
|
||||
@ -17,7 +16,7 @@ export default sfc({
|
||||
methods: {
|
||||
onClick(event) {
|
||||
this.$emit('click', event);
|
||||
this.routerLink();
|
||||
route(this.$router, this);
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@ -1,22 +0,0 @@
|
||||
/**
|
||||
* Common Cell Props
|
||||
*/
|
||||
|
||||
export default {
|
||||
props: {
|
||||
icon: String,
|
||||
center: Boolean,
|
||||
isLink: Boolean,
|
||||
required: Boolean,
|
||||
titleClass: String,
|
||||
valueClass: String,
|
||||
labelClass: String,
|
||||
title: [String, Number],
|
||||
value: [String, Number],
|
||||
label: [String, Number],
|
||||
border: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
}
|
||||
};
|
||||
@ -1,22 +0,0 @@
|
||||
/**
|
||||
* add Vue-Router support
|
||||
*/
|
||||
|
||||
export default {
|
||||
props: {
|
||||
url: String,
|
||||
replace: Boolean,
|
||||
to: [String, Object]
|
||||
},
|
||||
|
||||
methods: {
|
||||
routerLink() {
|
||||
const { to, url, $router, replace } = this;
|
||||
if (to && $router) {
|
||||
$router[replace ? 'replace' : 'push'](to);
|
||||
} else if (url) {
|
||||
replace ? location.replace(url) : location.href = url;
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
31
packages/mixins/router-link.ts
Normal file
31
packages/mixins/router-link.ts
Normal file
@ -0,0 +1,31 @@
|
||||
/**
|
||||
* add Vue-Router support
|
||||
*/
|
||||
|
||||
import { RenderContext } from 'vue';
|
||||
import VueRouter, { RawLocation } from 'vue-router/types';
|
||||
|
||||
export type RouteConfig = {
|
||||
url?: string;
|
||||
to?: RawLocation;
|
||||
replace?: boolean;
|
||||
};
|
||||
|
||||
export function route(router: VueRouter, config: RouteConfig) {
|
||||
const { to, url, replace } = config;
|
||||
if (to && router) {
|
||||
router[replace ? 'replace' : 'push'](to);
|
||||
} else if (url) {
|
||||
replace ? location.replace(url) : (location.href = url);
|
||||
}
|
||||
}
|
||||
|
||||
export function functionalRoute(context: RenderContext) {
|
||||
route(context.parent && context.parent.$router, context.props);
|
||||
}
|
||||
|
||||
export const routeProps = {
|
||||
url: String,
|
||||
replace: Boolean,
|
||||
to: [String, Object]
|
||||
};
|
||||
@ -4,7 +4,7 @@ exports[`renders demo correctly 1`] = `
|
||||
<div>
|
||||
<div>
|
||||
<div class="van-search" style="background:#f2f2f2;">
|
||||
<div placeholder="请输入搜索关键词" class="van-cell van-cell--borderless van-field">
|
||||
<div class="van-cell van-cell--borderless van-field">
|
||||
<div class="van-field__left-icon"><i class="van-icon van-icon-search">
|
||||
<!----></i></div>
|
||||
<div class="van-cell__value van-cell__value--alone">
|
||||
@ -16,7 +16,7 @@ exports[`renders demo correctly 1`] = `
|
||||
<div>
|
||||
<form action="/">
|
||||
<div class="van-search van-search--show-action" style="background:#f2f2f2;">
|
||||
<div placeholder="请输入搜索关键词" class="van-cell van-cell--borderless van-field">
|
||||
<div class="van-cell van-cell--borderless van-field">
|
||||
<div class="van-field__left-icon"><i class="van-icon van-icon-search">
|
||||
<!----></i></div>
|
||||
<div class="van-cell__value van-cell__value--alone">
|
||||
@ -31,7 +31,7 @@ exports[`renders demo correctly 1`] = `
|
||||
</div>
|
||||
<div>
|
||||
<div class="van-search van-search--show-action" style="background:#f2f2f2;">
|
||||
<div placeholder="请输入搜索关键词" class="van-cell van-cell--borderless van-field">
|
||||
<div class="van-cell van-cell--borderless van-field">
|
||||
<div class="van-field__left-icon"><i class="van-icon van-icon-search">
|
||||
<!----></i></div>
|
||||
<div class="van-cell__value van-cell__value--alone">
|
||||
|
||||
@ -11,9 +11,6 @@ test('change event', () => {
|
||||
}
|
||||
});
|
||||
|
||||
wrapper.vm.$on('input', value => {
|
||||
wrapper.setProps({ value });
|
||||
});
|
||||
wrapper.find('.van-switch').trigger('click');
|
||||
|
||||
expect(onChange.mock.calls[0]).toBeTruthy();
|
||||
|
||||
@ -1,14 +1,13 @@
|
||||
import { use } from '../utils';
|
||||
import Icon from '../icon';
|
||||
import Info from '../info';
|
||||
import RouterLink from '../mixins/router-link';
|
||||
import { route, routeProps } from '../mixins/router-link';
|
||||
|
||||
const [sfc, bem] = use('tabbar-item');
|
||||
|
||||
export default sfc({
|
||||
mixins: [RouterLink],
|
||||
|
||||
props: {
|
||||
...routeProps,
|
||||
icon: String,
|
||||
dot: Boolean,
|
||||
info: [String, Number]
|
||||
@ -32,7 +31,7 @@ export default sfc({
|
||||
onClick(event) {
|
||||
this.$parent.onChange(this.$parent.items.indexOf(this));
|
||||
this.$emit('click', event);
|
||||
this.routerLink();
|
||||
route(this.$router, this);
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
import { RenderContext, VNodeData } from 'vue';
|
||||
import { RenderContext, VNodeData } from 'vue/types';
|
||||
import { ScopedSlot } from 'vue/types/vnode';
|
||||
|
||||
type ObjectIndex = {
|
||||
[key: string]: any;
|
||||
@ -40,9 +41,23 @@ export function emit(context: Context, eventName: string, ...args: any[]) {
|
||||
if (Array.isArray(listeners)) {
|
||||
listeners.forEach(listener => {
|
||||
listener(...args);
|
||||
})
|
||||
});
|
||||
} else {
|
||||
listeners(...args);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// unify slots & scopedSlots
|
||||
export function unifySlots(context: Context) {
|
||||
const { scopedSlots } = context;
|
||||
const slots = context.slots();
|
||||
|
||||
Object.keys(slots).forEach(key => {
|
||||
if (!scopedSlots[key]) {
|
||||
scopedSlots[key] = () => slots[key];
|
||||
}
|
||||
});
|
||||
|
||||
return scopedSlots;
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user