Poptip add padding prop

This commit is contained in:
梁灏 2018-06-22 15:37:23 +08:00
parent 130ed8894b
commit a980832f84
2 changed files with 12 additions and 3 deletions

View file

@ -7,7 +7,7 @@
<Button @click="handleChange">change</Button> <Button @click="handleChange">change</Button>
</Tooltip> </Tooltip>
<Button @click="handleChange">change</Button> <Button @click="handleChange">change</Button>
<Poptip title="Title" transfer width="250" word-wrap content="我的文本超级,无敌,长我的文本超级无敌长我的文本超级无敌长我的文本超级无敌长我的文本超级无敌长我的文本超级无敌长"> <Poptip title="Title" transfer padding="0" width="250" word-wrap content="我的文本超级,无敌,长我的文本超级无敌长我的文本超级无敌长我的文本超级无敌长我的文本超级无敌长我的文本超级无敌长">
<Button>Click</Button> <Button>Click</Button>
</Poptip> </Poptip>
</div> </div>

View file

@ -36,8 +36,8 @@
</div> </div>
</div> </div>
<div :class="[prefixCls + '-inner']" v-if="!confirm"> <div :class="[prefixCls + '-inner']" v-if="!confirm">
<div :class="[prefixCls + '-title']" v-if="showTitle" ref="title"><slot name="title"><div :class="[prefixCls + '-title-inner']">{{ title }}</div></slot></div> <div :class="[prefixCls + '-title']" :style="contentPaddingStyle" v-if="showTitle" ref="title"><slot name="title"><div :class="[prefixCls + '-title-inner']">{{ title }}</div></slot></div>
<div :class="[prefixCls + '-body']"> <div :class="[prefixCls + '-body']" :style="contentPaddingStyle">
<div :class="contentClasses"><slot name="content"><div :class="[prefixCls + '-body-content-inner']">{{ content }}</div></slot></div> <div :class="contentClasses"><slot name="content"><div :class="[prefixCls + '-body-content-inner']">{{ content }}</div></slot></div>
</div> </div>
</div> </div>
@ -104,6 +104,10 @@
wordWrap: { wordWrap: {
type: Boolean, type: Boolean,
default: false default: false
},
// default by css: 8px 16px
padding: {
type: String
} }
}, },
data () { data () {
@ -161,6 +165,11 @@
[`${prefixCls}-body-content-word-wrap`]: this.wordWrap [`${prefixCls}-body-content-word-wrap`]: this.wordWrap
} }
]; ];
},
contentPaddingStyle () {
const styles = {};
if (!!this.padding) styles['padding'] = this.padding;
return styles;
} }
}, },
methods: { methods: {