1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162 |
- <template>
- <view
- class="u-line"
- :style="[lineStyle]"
- >
- </view>
- </template>
- <script>
- import props from './props.js';
-
- export default {
- name: 'u-line',
- mixins: [uni.$u.mpMixin, uni.$u.mixin,props],
- computed: {
- lineStyle() {
- const style = {}
- style.margin = this.margin
-
- if (this.direction === 'row') {
-
- style.borderBottomWidth = '1px'
- style.borderBottomStyle = this.dashed ? 'dashed' : 'solid'
- style.width = uni.$u.addUnit(this.length)
- if (this.hairline) style.transform = 'scaleY(0.5)'
- } else {
-
- style.borderLeftWidth = '1px'
- style.borderLeftStyle = this.dashed ? 'dashed' : 'solid'
- style.height = uni.$u.addUnit(this.length)
- if (this.hairline) style.transform = 'scaleX(0.5)'
- }
- style.borderColor = this.color
- return uni.$u.deepMerge(style, uni.$u.addStyle(this.customStyle))
- }
- }
- }
- </script>
- <style lang="scss" scoped>
- @import "../../libs/css/components.scss";
- .u-line {
-
- vertical-align: middle;
-
- }
- </style>
|