feat: 初始化
This commit is contained in:
74
uni_modules/uni-ui/components/uni-td/uni-td.vue
Normal file
74
uni_modules/uni-ui/components/uni-td/uni-td.vue
Normal file
@ -0,0 +1,74 @@
|
||||
<template>
|
||||
<!-- :class="{'table--border':border}" -->
|
||||
<view class="uni-table-td" :class="{'table--border':border}" :style="{width:width + 'px','text-align':align}">
|
||||
<slot></slot>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
/**
|
||||
* Td 单元格
|
||||
* @description 表格中的标准单元格组件
|
||||
* @tutorial https://ext.dcloud.net.cn/plugin?id=
|
||||
* @property {Number} align = [left|center|right] 单元格对齐方式
|
||||
*/
|
||||
export default {
|
||||
name: 'uniTd',
|
||||
options: {
|
||||
virtualHost: true
|
||||
},
|
||||
props: {
|
||||
width: {
|
||||
type: [String, Number],
|
||||
default: ''
|
||||
},
|
||||
align: {
|
||||
type: String,
|
||||
default: 'left'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
border: false
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.root = this.getTable()
|
||||
this.border = this.root.border
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 获取父元素实例
|
||||
*/
|
||||
getTable() {
|
||||
let parent = this.$parent;
|
||||
let parentName = parent.$options.name;
|
||||
while (parentName !== 'uniTable') {
|
||||
parent = parent.$parent;
|
||||
if (!parent) return false;
|
||||
parentName = parent.$options.name;
|
||||
}
|
||||
return parent;
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.uni-table-td {
|
||||
display: table-cell;
|
||||
padding: 12px 10px;
|
||||
// text-align: center;
|
||||
vertical-align: middle;
|
||||
border-bottom: 1px #ddd solid;
|
||||
// min-width: 150px;
|
||||
color: #666;
|
||||
font-size: 14px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.table--border {
|
||||
border-right: 1px #ddd solid;
|
||||
}
|
||||
|
||||
</style>
|
Reference in New Issue
Block a user