init

uni_modules/nutui-uni/components/radiogroup/index.scss

@@ -0,0 +1,21 @@
+.nut-radio-group {
+  display: inline-block;
+
+  .nut-radio {
+    margin-bottom: 5px;
+  }
+
+  &--horizontal {
+    .nut-radio {
+      display: inline-flex !important;
+      margin-right: 10px !important;
+
+      &--round {
+        .nut-radio__label {
+          margin: 0 6px !important;
+        }
+      }
+
+    }
+  }
+}

uni_modules/nutui-uni/components/radiogroup/index.ts

@@ -0,0 +1 @@
+export * from './radiogroup'

uni_modules/nutui-uni/components/radiogroup/radiogroup.ts

@@ -0,0 +1,31 @@
+import type { ExtractPropTypes } from 'vue'
+import { CHANGE_EVENT, UPDATE_MODEL_EVENT } from '../_constants'
+import { commonProps, isBoolean, isNumber, isString, makeStringProp } from '../_utils'
+
+export const radiogroupProps = {
+  ...commonProps,
+  /**
+   * @description 当前选中项的标识符，与 `label` 值一致时呈选中状态
+   */
+  modelValue: {
+    type: [Number, String, Boolean],
+    default: '',
+  },
+  /**
+   * @description 使用横纵方向，可选值 `horizontal`、`vertical`
+   */
+  direction: makeStringProp<'vertical' | 'horizontal'>('vertical'),
+  /**
+   * @description 文本所在的位置，可选值：`left`,`right`
+   */
+  textPosition: makeStringProp<'left' | 'right'>('right'),
+}
+
+export type RadioGroupProps = ExtractPropTypes<typeof radiogroupProps>
+
+export const radiogroupEmits = {
+  [CHANGE_EVENT]: (val: string | number | boolean) => isString(val) || isNumber(val) || isBoolean(val),
+  [UPDATE_MODEL_EVENT]: (val: string | boolean | number) => isString(val) || isNumber(val) || isBoolean(val),
+}
+
+export type RadioGroupEmits = typeof radiogroupEmits

uni_modules/nutui-uni/components/radiogroup/radiogroup.vue

@@ -0,0 +1,52 @@
+<script setup lang="ts">
+import { computed, defineComponent, readonly, watch } from 'vue'
+import { CHANGE_EVENT, PREFIX, UPDATE_MODEL_EVENT } from '../_constants'
+import { useProvide } from '../_hooks'
+import { getMainClass } from '../_utils'
+import { RADIO_KEY } from '../radio'
+import { radiogroupEmits, radiogroupProps } from './radiogroup'
+
+const props = defineProps(radiogroupProps)
+const emit = defineEmits(radiogroupEmits)
+const updateValue = (value: string | boolean | number) => emit(UPDATE_MODEL_EVENT, value)
+
+useProvide(RADIO_KEY)({
+  label: readonly(computed(() => props.modelValue)),
+  position: readonly(computed(() => props.textPosition)),
+  updateValue,
+})
+
+const classes = computed(() => {
+  return getMainClass(props, componentName, {
+    [`${componentName}--${props.direction}`]: true,
+  })
+})
+
+watch(
+  () => props.modelValue,
+  value => emit(CHANGE_EVENT, value),
+)
+</script>
+
+<script lang="ts">
+const componentName = `${PREFIX}-radio-group`
+
+export default defineComponent({
+  name: componentName,
+  options: {
+    virtualHost: true,
+    addGlobalClass: true,
+    styleIsolation: 'shared',
+  },
+})
+</script>
+
+<template>
+  <view :class="classes" :style="customStyle">
+    <slot />
+  </view>
+</template>
+
+<style lang="scss">
+@import './index';
+</style>