priceStyle.vue 566 B

1234567891011121314151617181920212223242526272829303132333435
  1. <template>
  2. <text class="price-box semiBold">
  3. <text class="icon">¥</text>
  4. <text class="big-num">{{priceArr[0]}}</text>
  5. <text>.</text>
  6. <text class="small-num">{{priceArr[1]}}</text>
  7. </text>
  8. </template>
  9. <script>
  10. export default{
  11. props:['price'],
  12. computed:{
  13. priceArr(){
  14. return this.price && this.price.toString().split('.')
  15. }
  16. }
  17. }
  18. </script>
  19. <style lang="scss" scoped>
  20. .price-box{
  21. color: #E93323;
  22. font-weight: 600;
  23. .icon{
  24. font-size: 24rpx;
  25. }
  26. .big-num{
  27. font-size: 40rpx;
  28. }
  29. .small-num{
  30. font-size: 24rpx;
  31. }
  32. }
  33. </style>