You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
43 lines
950 B
43 lines
950 B
|
3 years ago
|
<template>
|
||
|
|
<view class="s-divider" :class="c_class" :style="custom_style">
|
||
|
|
<slot />
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import componentMixin from '../../mixins/componentMixin';
|
||
|
|
|
||
|
|
/**
|
||
|
|
* s-divider 分割线
|
||
|
|
* @description 用于将内容分隔为多个区域
|
||
|
|
* @property {String} align = [left|right] 内容位置
|
||
|
|
* @property {Boolean} dashed 是否使用虚线
|
||
|
|
* @property {Boolean} hairline 是否使用 0.5px 线
|
||
|
|
* @example <s-divider></s-divider>
|
||
|
|
*/
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: 'SDivider',
|
||
|
|
mixins: [componentMixin],
|
||
|
|
props: {
|
||
|
|
align: String,
|
||
|
|
dashed: Boolean,
|
||
|
|
hairline: {
|
||
|
|
type: Boolean,
|
||
|
|
default: true,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
c_class() {
|
||
|
|
return this.$mergeClass({
|
||
|
|
[`s-divider--${this.align}`]: this.align,
|
||
|
|
's-divider--dashed': this.dashed,
|
||
|
|
's-divider--hairline': this.hairline,
|
||
|
|
}, this.custom_class);
|
||
|
|
},
|
||
|
|
},
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" src="./index.scss"></style>
|