Vue 3 Accessing Array Object - vue.js

Question

I'm trying to generate passwords by reactively. I have an array object inside my instance and I can list this object with v-for. Also and I can generate random passwords with characters in a passArry. But I need to send chars in data to the passArray when the checkbox is checked. But I can't reach options.status What should I do?
<div class="form-check" v-for="options in options" :key="options.optionName">
<input type="checkbox" class="form-check-input" v-model="options.status">
export default {
data() {
return {
generate: 5,
result: '',
passArry : [],
options :[
{
optionName : 'Lowercase',
status : true,
chars : 'abcdefghijklmnopqrstuvwxyz',
},
{
optionName: 'Uppercase',
status: false,
chars: 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'
},
{
optionName: 'Numbers',
status: true,
chars: '1234567890',
},
{
optionName: 'Symbols',
status: false,
chars: '~!##$%^&*()_-+={[}]|:;<,>.?/'
},
]
}
},
watch:{
generate(){
this.result.length > 0 ? this.result = '' : this.result
let charLength = this.passArry.length;
for(let i = 0; i < this.generate; i++){
this.result += this.passArry[Math.floor(Math.random() * charLength )]
}
},

Answer 1

In you case you would reach it not with option.status but options[0].status. Note that it is options[Array{Object, Object, Object, Object }], so you need to point at the first element of your array.

Answer 2

You have an 's' too many:
options in options should be option in options and then using this singular option:
<div class="form-check" v-for="option in options" :key="option.optionName">
<input type="checkbox" class="form-check-input" v-model="option.status">
</div>