cl-radio-group.vue 1000 B

12345678910111213141516171819202122232425262728293031323334353637383940414243444546
  1. <template>
  2. <view class="cl-radio-group">
  3. <slot></slot>
  4. </view>
  5. </template>
  6. <script>
  7. import Emitter from "../../mixins/emitter";
  8. import { cloneDeep } from "../../utils";
  9. /**
  10. * radio-group 单选框组
  11. * @description 单选框组
  12. * @tutorial https://docs.cool-js.com/uni/components/form/radio.html
  13. * @property {String, Number} value 绑定值
  14. * @property {Boolean} disabled 是否禁用
  15. * @property {Boolean} border 是否边框样式
  16. * @event {Function} change 绑定值改变时触发
  17. * @example <cl-radio-group v-model="val"><cl-radio label="1" /><cl-radio label="2" /></cl-radio-group>
  18. */
  19. export default {
  20. name: "cl-radio-group",
  21. componentName: "ClRadioGroup",
  22. props: {
  23. // 绑定值
  24. value: null,
  25. // 是否禁用
  26. disabled: Boolean,
  27. // 是否边框样式
  28. border: Boolean,
  29. },
  30. mixins: [Emitter],
  31. created() {
  32. // 监听单选框的变化
  33. this.$on("radio.change", (label) => {
  34. this.$emit("input", label);
  35. this.$emit("change", label);
  36. });
  37. },
  38. };
  39. </script>