diff --git a/src/components/GuipRadio.vue b/src/components/GuipRadio.vue
index 8a7baa0..e5b286c 100644
--- a/src/components/GuipRadio.vue
+++ b/src/components/GuipRadio.vue
@@ -1,18 +1,14 @@
-
-
+
+
{{( selectedValue === option.value ) ? (option.selectedLabel ? option.selectedLabel : option.label) :option.label }}
+ >
+ {{ getLabel(option) }}
+
@@ -55,6 +51,33 @@ export default {
type: Array,
default: () => [],
},
+ labelKey: {
+ type: String,
+ default: 'label'
+ },
+ // 自定义value的字段名
+ valueKey: {
+ type: String,
+ default: 'value'
+ },
+ // 格式化label的函数
+ formatter: {
+ type: Function,
+ default: null
+ }
+ },
+ computed: {
+ processedOptions() {
+ return this.options.map(option => {
+ if (this.formatter) {
+ return {
+ ...option,
+ formattedLabel: this.formatter(option)
+ }
+ }
+ return option
+ })
+ }
},
data() {
return {
@@ -73,6 +96,13 @@ export default {
this.$emit('input', value); // 更新 v-model
this.$emit('change', value); // 触发 change 事件
},
+ getLabel(option) {
+ if (this.formatter) return option.formattedLabel || this.formatter(option)
+ return option[this.labelKey]
+ },
+ getValue(option) {
+ return option[this.valueKey]
+ },
},
};
diff --git a/src/views/elementGroups.vue b/src/views/elementGroups.vue
index 3d5a520..28e52b7 100644
--- a/src/views/elementGroups.vue
+++ b/src/views/elementGroups.vue
@@ -14,6 +14,12 @@
@change="radioChange" :rules="rules.language" />
+
+
+
+
@@ -609,10 +615,10 @@ export default {
input3: '',
},
languageOptions: [
- { label: 'JavaScript', value: 'js', selectedLabel: 'JavaScripthhhhhhhhhh' },
- { label: 'Python', value: 'py', selectedLabel: 'JavaScripthhhhhhhhhh' },
- { label: 'Java', value: 'java', disabled: true, selectedLabel: 'JavaScripthhhhhhhhhh' }, // 禁用选项
- { label: 'Go', value: 'go', selectedLabel: 'JavaScripthhhhhhhhhh' },
+ { label: 'JavaScript', value: 'js', selectedLabel: 'JavaScripthhhhhhhhhh',id:'1',name:'麻辣烫' },
+ { label: 'Python', value: 'py', selectedLabel: 'JavaScripthhhhhhhhhh',id:'10',name:'易烊千玺' },
+ { label: 'Java', value: 'java', disabled: true, selectedLabel: 'JavaScripthhhhhhhhhh',id:'11',name:'王鹤di' }, // 禁用选项
+ { label: 'Go', value: 'go', selectedLabel: 'JavaScripthhhhhhhhhh',id:'12',name:'王俊凯' },
],
rules: {
username: [
@@ -872,6 +878,10 @@ export default {
}
},
methods: {
+ // 自定义的radio label 展示内容
+ formatLabel(option) {
+ return `${option.name} (ID: ${option.id})`;
+ },
findItemById(valueKey, key) {
// 自动查找选中项
return this.domainOptions.find(item => item[valueKey] === this.form[key]);