Comment définir l'entrée de la valeur de session dans Vue.js

Question

我有一个Vue.js的表单过滤器：

<b-row>
  <b-col md="3">
    <b-form-group>
      <label>姓名：</label>
      <entrée-formulaire-b
        placeholder="姓名"
        type="texte"
        class="d-inline-block"
        v-model = "nom"
        v-on:change="changeFilter()"
      />
    </b-form-group>
  ≪/b-col>
  <b-col md="3">
    <label>性别：</label>
    <v-sélectionner
      :options="genderOptions"
      classe = "w-100"
      v-model = "genre"
      v-on:change="changeFilter()"
    />
  ≪/b-col>
</b-row>

我有一个methods来获取输入和选择的值：

méthodes : {
  changementFilter() {
    console.log(ce.nom, ce.gender)
  },
},
谢谢
            

Answer 1

D'accord, donc la première bonne pratique est de ne pas utiliser cangeFilter() sur l'événement click, mais d'utiliser changeFilter. Donc si je vous comprends bien, vous souhaitez recharger la page et toujours sélectionner la même valeur. Vous pouvez enregistrer cette valeur dans le stockage local, en supposant qu'il ne s'agit pas de données sensibles.

Informations de stockage local Enregistrez les données dans le stockage local

localStorage.setItem('gender', 'Male');

Récupérez les données (vous devez utiliser un hook de cycle de vie comme monté pour initialiser les données)

mounted() {
   this.gender = localStorage.getItem('gender') || '你的默认值';
}


<b-form-input
            placeholder="Name"
            type="text"
            class="d-inline-block"
            v-model="gender"
            v-on:change="changeFilter"
            :value="gender"
          />

Valeurs sous formulaire de saisie HTML