v-for hat keine Möglichkeit, es zu installieren
P粉988025835
P粉988025835 2024-04-03 18:08:14
0
1
533

Ich habe ein Problem mit meinem v-for. Ich rufe die API auf und rufe die Daten ab, aber das V-for wird nicht aktualisiert.

Das ist mein HTML:

<input list="listenomspartenaires" id="inputlistenomspartenaires" type="text" name="nominputlistenomspartenaires">
        <datalist id="listenomspartenaires">
           <option v-for="partenaire in listedespartenaires" :value="partenaire.nom" :key="partenaire.idpartenaire" :data-idpartenaire="partenaire.idpartenaire" />  <!--  -->
</datalist>

und mein JS:

<script lang="js">
    import { defineComponent } from 'vue';

    export default defineComponent({
        data() {
            return {
                listedespartenaires : []
            };
        },
        methods:{            
            SetNoms(lesnoms){
                this.listedespartenaires = lesnoms;
                alert(lesnoms);
            }
        },
        mounted() {
            fetch("https://localhost:7264/api/partenaires/GetNoms")
                .then((response) => response.text())
                .then((data) => this.SetNoms(data));
        }
    });
</script>

Die Warnung zeigt die Daten an, sodass sie problemlos abgerufen werden können, aber meine Eingabe ist ungültig.

Ich habe auch versucht, „listedespartenaires“ direkt vom Get aus zuzuweisen, ohne es durch die Methode zu übergeben, aber das Ergebnis ist das gleiche.

Ich habe es auch versucht this.$forceUpdate(); nachdem ich „listedespartenaires“ zugewiesen habe. Aber kein Erfolg.

Kann mir jemand helfen?

Danke,

Philippe

P粉988025835
P粉988025835

Antworte allen(1)
P粉308089080

尝试JSON。 parse() 你的回应:

const app = Vue.createApp({
  data() {
    return {
      listedespartenaires : [],
      selected: null
    };
  },
  methods:{            
    setNoms(lesnoms){
      this.listedespartenaires = JSON.parse(lesnoms);
      //alert(lesnoms);
    }
  },
  mounted() {
    fetch("https://jsonplaceholder.typicode.com/users")
      .then((response) => response.text())
      .then((data) => this.setNoms(data));
  }
})
app.mount('#demo')

{{ selected }}
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage