uni-app组件 信息列表组件

之前我一直在，要想提高自己的代码质量，
就一定要封装自己的组件，
所以我就尽量使用自己的组件。这样可以提高自己的效率
写组件的好处：减少代码的冗余

封装组件的时候，为了不让子元素的padding,
影响父级元素的宽度。
父级元素使用了怪异盒子
/* 怪异盒子  不会计算padding */
box-sizing: border-box;

为了给提供者，可以修改盒子的背景色等。
如果是h5端的话，直接在主界面中给组件添加一个类就可以修改了
如果是在微信小程序中，需要给主界面的组件添加一个类，然后使用穿透属性

组件

<template>	
	<view class="part-demo">
		<view class="part-demo-flex" @click="hanlderThe(item)" v-for="(item,index) in picLuanglist">
			<view class="left-part">
				{{item.lauang}}
			</view>
			<view class="right-part">
				{{item.madata}}
			</view>
		</view>
	</view>
</template>

<script>
export default {
	props:{
		picLuanglist:{
			type:Array
		}
	},
	methods:{
		hanlderThe(mess){
			this.$emit("hanlder",[mess])
		}
	}
}
</script>

<style scoped>
	.part-demo{
		margin: auto;
		 690rpx;
		background:"#ffffff";
		border-radius: 20rpx;
		box-shadow: 0pt 0pt 13pt 6pt rgba(179,179,179,0.1); 
		padding-left: 30rpx;
		padding-right: 32rpx;
		/* 怪异盒子  不会计算padding */
		box-sizing: border-box;
	}
	.part-demo-flex{
		display: flex;
		justify-content: space-between;
		height: 94rpx;
		line-height: 94rpx;
	}
	
	.left-part{
		 500rpx;
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
		font-size: 32rpx;
		font-weight: 400;
		color: #963c3c;
	}
	.right-part{
		font-size: 24rpx;
		font-weight: 400;
		color: #963c3c;
		text-align: right;
	}
</style>

主页面

<pic-laung-dec-list-part :picLuanglist="picLuanglist"
    @hanlder="currentHanler"
    class="my-updata"
></pic-laung-dec-list-part>

import picLaungDecListPart  from "../../components/picLaungDecListPart.vue"

picLuanglist:[
{lauang:"关于开展2020年教职工送温暖活动",madata:"02-01"},
{lauang:"关于举行致敬！度颁奖晚会的通知",madata:"02-11"},
{lauang:"关于开展教职工“送温暖”活动的",madata:"03-21"},
{lauang:"关于举行 “致敬！度颁奖晚会的通知",madata:"04-11"},
{lauang:"开展校园资产管理培训会议通知",madata:"04-21"},
]

components:{
	"pic-laung-dec-list-part":picLaungDecListPart
},

methods:{
    currentHanler(mess){
	console.log(mess[0])
    }
}

如何想在主界面中，修改css样式咋办？？？？


/*适用H5*/
.my-updata {
	background: #09BB07;
}
/*适用小程序*/
.my-updata >>> .part-demo{
	background: #09BB07;
}