我的 v-for 有问题。我调用 API 并检索数据,但 v-for 未更新。
这是我的 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>
和我的 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>
警报显示了数据,因此可以很好地检索它们,但我的输入无效。
我还尝试直接从获取中分配“listedespartenaires”,而不通过方法传递,但结果是相同的。
在分配“listedespartenaires”后,我还尝试了 this.$forceUpdate(); 。但没有成功。
有人可以帮助我吗?
谢谢,
菲利普
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
尝试
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')