<template>
<view class="content">
<view class="parent-class"></view>
</view>
</template>
<script>
export default {
externalClasses: ['parent-class'],
options: {virtualHost: true},
name: 'titlebar',
data() {
return {
statusBarHeight: 0
}
},
mounted() {
const sys = uni.getSystemInfoSync();
if (sys.statusBarHeight) {
this.statusBarHeight = sys.statusBarHeight
}
}
}
</script>
<style lang="scss">
.content{
display: flex;
width: 100%;
flex-wrap: wrap;
flex-direction: column;
}
</style>父类：
<template>
<view class="app">
<titlebar :title="title" parent-class="dynamic-parent-class"></titlebar>
</view>
</template>
<script>
import titlebar from './components/titlebar.vue'
export default {
components: {
titlebar
}
}
</script>
<style lang='scss'>
.dynamic-parent-class{
background-color: red;
width: 100%;
height: 100rpx;
}
</style>
0 个回复