给我一个完整的微信小程序组件的代码

以下是一个简单的微信小程序组件代码，实现了一个自定义的计数器组件：

<!-- counter.wxml -->
<view class="counter">
  <button class="btn minus" bindtap="handleMinus">-</button>
  <view class="num">{{num}}</view>
  <button class="btn add" bindtap="handleAdd">+</button>
</view>

// counter.js
Component({
  properties: {
    num: {
      type: Number,
      value: 0,
    },
  },
  methods: {
    handleAdd() {
      this.setData({
        num: this.data.num + 1,
      });
    },
    handleMinus() {
      this.setData({
        num: this.data.num - 1,
      });
    },
  },
});

/* counter.wxss */
.counter {
  display: flex;
  align-items: center;
}

.num {
  font-size: 32rpx;
  margin: 0 20rpx;
}

.btn {
  width: 50rpx;
  height: 50rpx;
  border-radius: 50%;
  color: #fff;
  text-align: center;
  line-height: 50rpx;
}

.add {
  background-color: #07c160;
}

.minus {
  background-color: #ee0a24;
}

使用方法：

在需要使用计数器的页面或组件中引入该组件：

<!-- page.wxml -->
<view>
  <counter num="{{count}}" />
</view>

// page.js
Page({
  data: {
    count: 0,
  },
});

其中 `count` 是计数器的初始值，可以通过修改 `count` 的值来改变计数器的显示。