blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-05-26 00:09:15 +08:00
Code Issues Projects Releases Wiki Activity

修改cell required实现

Browse Source
This commit is contained in:
niunai 2017-03-30 18:13:53 +08:00
parent e241d92cd9
commit 544c21e798
3 changed files with 23 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
docs/examples-docs/cell.md
View File

@ -61,18 +61,6 @@ export default {
``` ```
::: :::
#### 带*号，标明必填
传入`required`属性
:::demo 带*号，标明必填
```html
<zan-cell-group>
<zan-cell title="单元格1" required></zan-cell>
</zan-cell-group>
```
:::
#### 标题带描述信息 #### 标题带描述信息
传入`label`属性，属性值为描述信息的值。 传入`label`属性，属性值为描述信息的值。

8
packages/cell/src/cell.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<a class="zan-cell" :href="url" @click="handleClick"> <a :class="['zan-cell', { 'zan-cell--required': required }]" :href="url" @click="handleClick">
<div <div
:class="{ 'zan-cell__title': true, 'zan-cell__required': required }" class="zan-cell__title"
v-if="this.$slots.title || title" v-if="this.$slots.title || title"
> >
<i v-if="icon" class="zan-icon" :class="'zan-icon-' + icon"></i> <i v-if="icon" class="zan-icon" :class="'zan-icon-' + icon"></i>
@ -14,8 +14,8 @@
class="zan-cell__value" class="zan-cell__value"
v-if="value || this.$slots.default" v-if="value || this.$slots.default"
:class="{ :class="{
'is-link': isLink, 'zan-cell__value--link': isLink,
'is-alone': !this.$slots.title && !title && !label 'zan-cell__value--alone': !this.$slots.title && !title && !label
}" }"
> >
<slot> <slot>

31
packages/zanui-css/src/cell.css
View File

@ -36,16 +36,6 @@
@e title { @e title {
float: left; float: left;
&.zan-cell__required {
&::before {
content: '*';
position: absolute;
left: -7px;
font-size: 14px;
color: #f44;
}
}
} }
@e label { @e label {
@ -59,15 +49,32 @@
float: right; float: right;
overflow: hidden; overflow: hidden;
@when link { @m link {
margin-right: 20px; margin-right: 20px;
} }
@when alone { @m alone {
float: none; float: none;
} }
} }
@m required {
overflow: visible;
&::before {
content: '*';
position: absolute;
left: -7px;
font-size: 14px;
color: #f44;
}
.zan-cell__title {
float: none;
display: inline-block;
}
}
.zan-icon-arrow { .zan-icon-arrow {
position: absolute; position: absolute;
top: 50%; top: 50%;