okay… figured this out. Thanks for the help @Ilia
This is what worked, for future reference:
<div class="col-4 q-pa-sm">
<q-badge color="secondary" multi-line>
Model: "{{ Peepsmodel }}"
</q-badge>
<q-select
v-model="Peepsmodel"
bg-color="grey-3"
:options="options"
label="Dog Owner"
hint="Owner - must exist as a person"
/>
</div>
mounted () {
this.getpeople()
console.log(" Mounted: this - ", this)
},
addNewDog() {
if (this.callName !== null && this.regName !== null) {
this.$q.notify({
color: 'green-4',
textColor: 'white',
icon: 'cloud_done',
message: 'New Dog Has Been Added'
})
// Add New Dog to the database
let newDog = {
id: Date.now(),
callName: this.callName,
regName: this.regName,
dogOwner: this.Peepsmodel.value,
dogCoOwner: this.dogCoOwner,
dogHandler: this.dogHandler,
dogBday: this.dogBday,
dogBreed: this.dogBreed,
dogHeight: this.dogHeight,
akcNum: this.akcNum,
done: false
}
db.collection('dogs').add(newDog)
// this.dogs.push(newDog)
this.newDog = ''
} else {
this.$q.notify({
type: 'negative',
message: `Please fill in all form fields.`
})
}
},
getpeople() {
return new Promise((resolve) => {
db.collection('people')
.orderBy('l_name')
.get()
.then((people) => {
var myPeeps = []
for (var i = 0 ; i < people.length; i++) {
myPeeps.push({value: people[i].id, label: people[i].l_name + ', ' + people[i].f_name}); ``
}
this.options = myPeeps
resolve(people)
console.log(" ******* This is the getPeople method ", people)
})
})
},
