使用反向()在Vue.JS中反向JSON数据

Question

我需要逆转在Vue.JS项目中使用的JSON提要的顺序。

在其他框架中，反向()函数已经完成了这项工作。我尝试过在Vue.JS脚本中添加内容，但还没有joy。

对其他语法有什么想法吗？

<script type="text/javascript">
new Vue({
    el: '#vueapp',
    data: {
        json: null
    },
    created: function () {
        var _this = this;
        $.getJSON('https://www.example.com/myfeed.json', function (json) {
            _this.json.reverse() = json;
        });
    }
});
</script>

因此，JSON中的最后一项(下面示例中位于山边的房子)将在页面加载JSON数据时首先显示。

https://jsfiddle.net/5kt9jurc/3/

一些谷歌似乎表明，反向()不再适用于Vue2，并受到反对。

Answer 1

你可以反转数组。看看我的小提琴。我用getJSON代替了获取来使用承诺。而且你不需要做var _this = this;，它看起来有点奇怪。因为在Vue.js中，属性是反应性的，所以您可以只设置一个值。

这是一个代码：

const app = new Vue({
  el: '#app',
  data: {   
    items: []
  },
  created: function() {
    fetch('https://api.jsonbin.io/b/5b02b2bbc83f6d4cc7349a7b')
      .then(resp => resp.json())
      .then(items => {        
        this.items = items.reverse()
      })
  }
});

Answer 2

我觉得你想要的是这样的：

_this.json = json.reverse();

也就是说，假设json是一个已经解析的json数组。否则，首先解析json字符串：

const array = JSON.parse(jsonString);
this.data = array.reverse();

您所做的方式是将值赋值给表达式的结果，这没有多大意义(右侧的值不能分配给)。