父组件给子组件传CSS样式
1.子组件bigButton.vue<template><button :style="styleObject"><slot></slot></button></template><script>export default {name: 'Button...
·
1.子组件bigButton.vue
<template>
<button :style="styleObject">
<slot></slot>
</button>
</template>
<script>
export default {
name: 'Button',
data() {
return {
}
},
props:{
width:{
type:String
}
},
computed:{
styleObject:function(){
return {
width:this.width+'%'
}
}
},
}
</script>
2.父组件中使用
<v-bigbutton width="90">查看活动链接</v-bigbutton>
<script>
import bigbutton from '../../components/common/bigButton'
export default {
components: {
'v-bigbutton':bigbutton,
},
}
</script>
更多推荐
已为社区贡献71条内容
所有评论(0)