wepy 组件

<!-- 分享 -->

<style lang='less'>
.share {
position: fixed;
top: 0;
left: 0;
750rpx;
height: 1334rpx;
background: rgba(0, 0, 0, 0.6);
z-index: 1999;
.share_nr {
background: url(https://img.tumaimai.com.cn/share_bg.png) no-repeat;
522rpx;
height: 640rpx;
background-size: cover;
margin: 204rpx auto;
z-index: 999;
.text_d_t {
display: block;
text-align: center;
}
.brown_text {
font-size: 72rpx;
font-family: PingFangSC-Medium;
font-weight: 500;
color: #732b00;
.text_d_t;
padding-top: 157rpx;
.brown_t_small {
font-size: 36rpx;
}
}
.black_text {
font-size: 28rpx;
font-family: PingFangSC-Regular;
font-weight: 400;
color: #19171d;
.text_d_t;
padding-top: 100rpx;
}
.gray_text {
font-size: 24rpx;
font-family: PingFangSC-Light;
font-weight: 300;
color: #808080;
.text_d_t;
padding-top: 39rpx;
}
.but {
padding-top: 57rpx;
522rpx;
button {
padding: 0rpx;
365rpx;
height: 70rpx;
background: linear-gradient(
80deg,
rgba(249, 87, 56, 1),
rgba(248, 42, 94, 1)
);
box-shadow: 0rpx 2rpx 24rpx 0rpx rgba(248, 61, 78, 0.66);
border-radius: 35rpx;
display: block;
margin: 0 auto;
font-size: 24rpx;
font-family: PingFangSC-Regular;
font-weight: 400;
color: #ffffff;
line-height: 70rpx;
text-align: center;
}
}
}
}
</style>
<template>
<view class='share'>
<view class="share_nr">
<view class="brown_text">{{brown_text}}<text class="brown_t_small">{{brown_text_small}}</text></view>
<view class="black_text">{{black_text}}</view>
<view class="gray_text">{{gray_text}}</view>
<view class="but"><button form-type="submit">{{button_text}}</button>
</view>
</view>
</view>
</template>

<script>
import wepy from 'wepy';
export default class Share extends wepy.component {
props = {
brown_text: String,
brown_text_small: String,
black_text: String,
gray_text: String,
button_text: String
};
data = {};
components = {};
methods = {};
events = {};
watch = {};
computed = {};
onLoad() {}
onShow() {}
}
</script>
 
 
用模板
<template>
<share :brown_text="brown_text" :brown_text_small="brown_text_small" :black_text="black_text" :gray_text="gray_text" :button_text="button_text"></share>
</template>
import Share from '../../components/share'
brown_text:'+200',
brown_text_small:'积分',
black_text:'恭喜已获得认证积分200',
gray_text:'继续完成任务可凭积分换取更多大礼',
button_text:'完成新手任务大礼',
components = {
panel: Panel,
panel_renwu: Panel,
share: Share,
}
原文地址:https://www.cnblogs.com/ylblogs/p/9878218.html