Skip to content
This repository was archived by the owner on Mar 27, 2025. It is now read-only.

Commit abc4365

Browse files
committed
fix(BFormRadio): use of primitives.
1 parent 8a588c9 commit abc4365

File tree

3 files changed

+40
-30
lines changed

3 files changed

+40
-30
lines changed

apps/playground/src/components/Comps/TFormRadio.vue

+7-15
Original file line numberDiff line numberDiff line change
@@ -78,31 +78,24 @@
7878
</BRow>
7979
<BRow>
8080
<BCol>
81-
<h4>Radio bound to array</h4>
81+
<h4>Radio with primitives</h4>
8282
</BCol>
8383
</BRow>
8484
<BRow>
8585
<BCol>
86-
<strong>Select some cars</strong>
86+
<strong>Select</strong>
8787
</BCol>
8888
<BCol>
89-
<strong>Selected cars</strong>
89+
<strong>Selected</strong>
9090
</BCol>
9191
</BRow>
9292
<BRow>
9393
<BCol>
94-
<BFormRadio
95-
v-for="(car, index) in radioAvailableCars"
96-
:key="index"
97-
v-model="radioSelectedCars"
98-
:value="car"
99-
>{{ car }}</BFormRadio
100-
>
94+
<BFormRadio v-model="radioPrimitives" :value="true">Yes</BFormRadio>
95+
<BFormRadio v-model="radioPrimitives" :value="false">No</BFormRadio>
10196
</BCol>
10297
<BCol>
103-
<ul>
104-
<li v-for="(car, index) in radioSelectedCars" :key="index">{{ car }}</li>
105-
</ul>
98+
<strong>{{ radioPrimitives }}</strong>
10699
</BCol>
107100
</BRow>
108101
</BContainer>
@@ -117,7 +110,6 @@ const radioRequired = ref(false)
117110
const radioIndeterminate = ref(false)
118111
const radioString = ref('incorrect')
119112
const radioPlain = ref(false)
120-
const radioAvailableCars = ['BMW', 'Mercedes', 'Toyota']
121-
const radioSelectedCars = ref([])
122113
const radioSelected = ref()
114+
const radioPrimitives = ref(false)
123115
</script>

apps/playground/src/components/Comps/TFormRadioGroup.vue

+25
Original file line numberDiff line numberDiff line change
@@ -97,6 +97,30 @@
9797
/>
9898
</BCol>
9999
</BRow>
100+
<BRow>
101+
<BCol>
102+
<h4>Radio with primitives</h4>
103+
</BCol>
104+
</BRow>
105+
<BRow>
106+
<BCol>
107+
<strong>Select</strong>
108+
</BCol>
109+
<BCol>
110+
<strong>Selected</strong>
111+
</BCol>
112+
</BRow>
113+
<BRow>
114+
<BCol>
115+
<BFormRadioGroup v-model="radios.radioPrimitives">
116+
<BFormRadio :value="true">Yes</BFormRadio>
117+
<BFormRadio :value="false">No</BFormRadio>
118+
</BFormRadioGroup>
119+
</BCol>
120+
<BCol>
121+
<strong>{{ radios.radioPrimitives }}</strong>
122+
</BCol>
123+
</BRow>
100124
</BContainer>
101125
</template>
102126

@@ -135,5 +159,6 @@ const radios = reactive({
135159
{value: {e: 1}, text: 'Option E'},
136160
],
137161
},
162+
radioPrimitives: false,
138163
})
139164
</script>

packages/bootstrap-vue-next/src/components/BFormRadio/BFormRadio.vue

+8-15
Original file line numberDiff line numberDiff line change
@@ -120,30 +120,23 @@ const localValue = computed({
120120
? JSON.stringify(parentData.modelValue.value) === JSON.stringify(props.value)
121121
: JSON.stringify(modelValue.value) === JSON.stringify(props.value),
122122
set: (newValue: string | boolean | unknown[] | Record<string, unknown> | number | null) => {
123-
const updateValue = newValue || newValue === '' || newValue === 0 ? props.value : false
123+
const updateValue =
124+
newValue ||
125+
newValue === '' ||
126+
newValue === 0 ||
127+
JSON.stringify(newValue) === JSON.stringify(props.value)
128+
? props.value
129+
: false
124130
125131
emit('input', updateValue)
126132
modelValue.value = updateValue
127133
nextTick(() => {
128134
emit('change', updateValue)
129135
})
136+
if (parentData !== null) parentData.set(props.value)
130137
},
131138
})
132139
133-
watch(
134-
() => parentData?.modelValue.value,
135-
(newValue) => {
136-
const isEqual = JSON.stringify(newValue) === JSON.stringify(props.value)
137-
if (isEqual === true) return
138-
localValue.value = false
139-
}
140-
)
141-
142-
watch(modelValue, (newValue) => {
143-
if (parentData === null || newValue === false) return
144-
parentData.set(props.value)
145-
})
146-
147140
const computedRequired = computed(
148141
() =>
149142
!!(props.name ?? parentData?.name.value) &&

0 commit comments

Comments
 (0)