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.
228 lines
6.9 KiB
228 lines
6.9 KiB
export default {
|
|
props: {
|
|
// flex排列方式
|
|
flexDirection: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
// flex-direction的简写
|
|
fd: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
// 展示类型
|
|
display: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
// display简写
|
|
d: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
// 主轴排列方式
|
|
justifyContent: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
// justifyContent的简写
|
|
jc: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
// 纵轴排列方式
|
|
alignItems: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
// align-items的简写
|
|
ai: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
color: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
// color简写
|
|
c: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
// 字体大小
|
|
fontSize: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// font-size简写
|
|
fs: {
|
|
type: [String, Number],
|
|
default: ''
|
|
},
|
|
margin: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// margin简写
|
|
m: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// margin-top
|
|
marginTop: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// margin-top简写
|
|
mt: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// margin-right
|
|
marginRight: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// margin-right简写
|
|
mr: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// margin-bottom
|
|
marginBottom: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// margin-bottom简写
|
|
mb: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// margin-left
|
|
marginLeft: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// margin-left简写
|
|
ml: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// padding-left
|
|
paddingLeft: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// padding-left简写
|
|
pl: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// padding-top
|
|
paddingTop: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// padding-top简写
|
|
pt: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// padding-right
|
|
paddingRight: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// padding-right简写
|
|
pr: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// padding-bottom
|
|
paddingBottom: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// padding-bottom简写
|
|
pb: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// border-radius
|
|
borderRadius: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// border-radius简写
|
|
radius: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
// transform
|
|
transform: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
// 定位
|
|
position: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
// position简写
|
|
pos: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
// 宽度
|
|
width: {
|
|
type: [String, Number],
|
|
default: null
|
|
},
|
|
// width简写
|
|
w: {
|
|
type: [String, Number],
|
|
default: null
|
|
},
|
|
// 高度
|
|
height: {
|
|
type: [String, Number],
|
|
default: null
|
|
},
|
|
// height简写
|
|
h: {
|
|
type: [String, Number],
|
|
default: null
|
|
},
|
|
top: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
right: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
bottom: {
|
|
type: [String, Number],
|
|
default: 0
|
|
},
|
|
left: {
|
|
type: [String, Number],
|
|
default: 0
|
|
}
|
|
},
|
|
computed: {
|
|
viewStyle() {
|
|
const style = {}
|
|
const addStyle = uni.$u.addStyle(this.width || this.w) && (style.width = addStyle(this.width || this.w))(this.height || this.h) && (style.height = addStyle(this.height || this.h))(this.margin || this.m) && (style.margin = addStyle(this.margin || this.m))(this.marginTop || this.mt) && (style.marginTop = addStyle(this.marginTop || this.mt))(this.marginRight || this.mr) && (style.marginRight = addStyle(this.marginRight || this.mr))(this.marginBottom || this.mb) && (style.marginBottom = addStyle(this.marginBottom || this.mb))(this.marginLeft || this.ml) && (style.marginLeft = addStyle(this.marginLeft || this.ml))(this.padding || this.p) && (style.padding = addStyle(this.padding || this.p))(this.paddingTop || this.pt) && (style.paddingTop = addStyle(this.paddingTop || this.pt))(this.paddingRight || this.pr) && (style.paddingRight = addStyle(this.paddingRight || this.pr))(this.paddingBottom || this.pb) && (style.paddingBottom = addStyle(this.paddingBottom || this.pb))(this.paddingLeft || this.pl) && (style.paddingLeft = addStyle(this.paddingLeft || this.pl))(this.color || this.c) && (style.color = this.color || this.c)(this.fontSize || this.fs) && (style.fontSize = this.fontSize || this.fs)(this.borderRadius || this.radius) && (style.borderRadius = this.borderRadius || this.radius)(this.position || this.pos) && (this.position = this.position || this.pos)(this.flexDirection || this.fd) && (this.flexDirection = this.flexDirection || this.fd)(this.justifyContent || jc) && (this.justifyContent = this.justifyContent || jc)(this.alignItems || ai) && (this.alignItems = this.alignItems || ai)
|
|
|
|
return uni.$u.deepMerge(style, uni.$u.addStyle(this.customStyle))
|
|
}
|
|
},
|
|
methods: {
|
|
// 获取margin或者padding的单位，比如padding: 0 20转为padding: 0 20px
|
|
getUnit(unit = '') {
|
|
// 取出两端空格，分隔成数组，再对数组的每个元素添加单位，最后再合并成字符串
|
|
return uni.$u.trim(unit).split(' ').map((item) => uni.$u.addUnit(item)).join(' ')
|
|
}
|
|
}
|
|
}
|
|
|