graceNvueBorderRadius.vue 488 B

123456789101112131415161718192021222324
  1. <template>
  2. <view class="grace-border-radius"
  3. :style="{
  4. backgroundImage:background,
  5. borderTopLeftRadius:radius[0],
  6. borderTopRightRadius:radius[1],
  7. borderBottomRightRadius:radius[2],
  8. borderBottomLeftRadius:radius[3]}">
  9. <slot></slot>
  10. </view>
  11. </template>
  12. <script>
  13. export default{
  14. props:{
  15. radius : {type:Array, default:function(){
  16. return['10px', '10px', '10px', '10px']
  17. }},
  18. background:{type:String, default:""}
  19. }
  20. }
  21. </script>
  22. <style>
  23. .grace-border-radius{}
  24. </style>