I have a pair of radio buttons that are linked together to accept a boolean value, either true or false. I am trying to implement a functionality where the selected value is stored in local storage. For example, if true is chosen, then true will be saved in local storage; if later false is selected, the true value will be deleted and false will be saved instead. The same process should work vice versa. I hope this explanation makes sense.
You can view my code on codesandbox
<template>
<div>
<div>
<label
>One
<input type="radio" name="radio" value="true" v-model="websiteAccept" />
</label>
<label
>No
<input
type="radio"
name="radio"
value="false"
v-model="websiteAccept"
/>
</label>
<p>{{ websiteAccept }}</p>
</div>
</div>
</template>
<script>
export default {
data() {
return {
websiteAccept: null,
};
},
};
</script>