Блог

Главная - Вопросы по программированию - Как я могу сохранить выбранную опцию формы в Vue в Firebase

Как я могу сохранить выбранную опцию формы в Vue в Firebase

#javascript #firebase #vue.js

#javascript #firebase #vue.js

Вопрос:

У меня есть коллекция, в которую я хочу, чтобы опция, выбранная пользователем, была отправлена в firebase.

 <select v-model="selected">
<option disabled value="">Marital Status</option>
<option>Married</option>
<option>Single</option>
<option>Divorced</option>
<option>Widow</option>
</select>

Когда я привязываю выбранную форму к profile.MaritalStatus, выбранная опция будет отправлена в коллекцию профилей в firebase, но заполнитель в форме выбора не будет отображаться на странице.
Как я могу связать с v-model=»selected» и иметь возможность отправить ее в коллекцию профилей.

 data (){
selected:"",
profile:{
maritalStatus: null,
age: null, 
profession: null,
}
},

methods:{
Save(){   db.collection("profile").add(this.profile)
}
}

Мне нужен заполнитель, подобный этому

введите описание изображения здесь

Ответ №1:

 var app = new Vue({
  el: '#app',
  data: {
    selected: ''
  },
  watch:{
   selected:function(){
     console.log('selected is '  this.selected " do you logic here");
   }
 }
})  
 <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<body>
<div id="app">
<select v-model="selected">
    <option value="" disabled selected>Marital Status</option>
    <option>Married</option>
    <option>Single</option>
    <option>Divorced</option>
    <option>Widow</option>
</select>
Selected:{{selected}}
</div>
</body>

Вы ищете что-то подобное?

     <select name="maritalStatus" v-model="selected">
        <option value="" disabled selected>Marital Status</option>
        <option>Married</option>
        <option>Single</option>
        <option>Divorced</option>
        <option>Widow</option>
    </select>

Кроме того, вы можете добавить наблюдателя для вызова save()

 watch:{
  selected:function(new,old){
   //write your logic here
  }
}

Комментарии:

1. Я хочу, чтобы заполнитель все еще присутствовал в форме и все еще мог отправляться в коллекцию профилей, привязка к профилю будет отправлена в коллекцию профилей, но заполнитель не появится, это важно, и я хочу, чтобы он был там. Любое предложение, пожалуйста!