v-for 没有安装他的选项
P粉988025835
P粉988025835 2024-04-03 18:08:14
0
1
471

我的 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(); 。但没有成功。

有人可以帮助我吗?

谢谢,

菲利普

P粉988025835
P粉988025835

全部回复(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')
sssccc
{{ selected }}
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板