javascript - Vue JS - 将 Json 放在数据上

标签 javascript json vue.js

我想把我的JSON数据转成Vue数据,还有一个显示,为什么我不能工作?

compiled: function(){
    var self = this;
    console.log('teste');

    $.ajax({
        url: 'js/fake-ws.json',
        complete: function (data) {
            self.$data.musics = data;
            console.log(self.$data.musics);
        }
    })
}

<div id="playlist" class="panel panel-default">
    <div class="panel-body">
        <ul>
            <li v-repeat="musics.item" >
                <a href="">{{nome}}</a>
            </li>
        <ul>
    <div>
</div>  

我无法让代码工作.. 为什么?

最佳答案

我认为问题在于 musics 最初不是 Vue 数据的一部分,因此当您使用 self.$data.musics = data 设置它的值时,Vue不知道它需要看它。相反,您需要像这样使用 $add 方法: self.$set("音乐", 数据);

来自 VueJs 指南:

In ECMAScript 5 there is no way to detect when a new property is added to an Object, or when a property is deleted from an Object. To deal with that, observed objects will be augmented with two methods: $add(key, value) and $delete(key). These methods can be used to add / delete properties from observed objects while triggering the desired View updates.

关于javascript - Vue JS - 将 Json 放在数据上,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27752499/

相关文章:

javascript - Django formset.js : Can't delete a from

javascript - 这个条件在三元中起什么作用?

php - 代码点火器 JSON

vue.js - 从 v-select 获取项目文本

javascript - 单击列排序会更改我们单击的列行的颜色 - javascript

javascript - 有没有办法将 <canvas> 覆盖在全屏 HTML5 <video> 上?

java - 当前推荐的将 byte[] 转换为 JsonNode 并返回的方法

android - 使用gson解析jsonarray中的多个json对象

javascript - 为什么我的组件模板没有出现在 Vue 中?

vue.js - 使用嵌套数据和 v-slot :item Vuetify 数据表