需要将此vue-router功能翻译为ecma脚本2015

Question

我没有将以下功能翻译成ecmascript 2015

  route: {
        data: function () {
            return this.$http.get('/api/posts?sort=title&order=1').then(
                    posts=>{this.table.posts = posts.data}
            );
        }
    },

因为this没有引用窗口对象我得到了

[vue-router] Uncaught error during transition: be.js:3660:7

TypeError: undefined has no properties[Learn More]be.js:16572:13

Answer 1

您可以使用某些功能，例如shorthand method names和更紧凑的箭头功能，使其看起来更像ES2015，但它不会改变功能：

route: {
    data() {
        return this.$http
            .get('/api/posts?sort=title&order=1')
            .then(posts => { this.table.posts = posts.data });
    }
},

您无法用箭头函数替换data钩子函数，因为this会引用错误的上下文（window或undefined） ，因为this将由其周围的词汇范围定义，无法覆盖。