<template> <view class="klon-buttom"> <view class="klon-frame"> <button type="primary" class="klon-buy" @click="buy(1)" v-if="goodsObjact.stock > 0"> <view class="klon-buyText">立即购买</view> </button> <button type="primary" class="klon-no" v-if="goodsObjact.stock < 1"> <view class="klon-buyText">已售罄</view> </button> </view> </view> </template> <script> export default { props: { goodsObjact: { type: Object, default: function () { return { } } }, }, data() { return { }; }, methods: { buy(data){ this.$emit('buy',data) } } }; </script> <style lang="scss"> .klon-buttom { position: fixed; bottom: 0rpx; z-index: 95; display: flex; justify-content: center; align-items: center; width: 750rpx; height: 100rpx; padding: 10rpx 30rpx; background-color: #ffffff; .klon-frame { width: 100%; .klon-buy { border-radius: 100rpx; // background: linear-gradient(270deg, rgba(181,116,242, 1) 0%, rgba(139,86,254, 1) 100%); background:linear-gradient(14deg,rgba(255,116,37,1),rgba(255,30,41,1)); } .klon-no { border-radius: 100rpx; background: #999999; } .klon-buyText { font-size: 34rpx; width: 100%; } } } </style>