javascript - Vue JS语法求解读

问题描述

问 题

本人刚学 JavaScript 和 VueJs，看Vue官方的Demo发现这样的写法有点吃力，想请教大家这行代码什么含义，或者帮我找个教程我自己学学也行，我不知道这是JS的语法还是ES6什么的新语法，新东东太多太杂。

const createListView = id => () => import('../views/CreateListView').then(m => m.default(id))

来自（第7行）：https://github.com/vuejs/vue-...

完整代码：

import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router)

// route-level code splitting
const createListView = id => () => import('../views/CreateListView').then(m => m.default(id))
const ItemView = () => import('../views/ItemView.vue')
const UserView = () => import('../views/UserView.vue')

export function createRouter () {
  return new Router({
    mode: 'history',
    scrollBehavior: () => ({ y: 0 }),
    routes: [
      { path: '/top/:page(\\d+)?', component: createListView('top') },
      { path: '/new/:page(\\d+)?', component: createListView('new') },
      { path: '/show/:page(\\d+)?', component: createListView('show') },
      { path: '/ask/:page(\\d+)?', component: createListView('ask') },
      { path: '/job/:page(\\d+)?', component: createListView('job') },
      { path: '/item/:id(\\d+)', component: ItemView },
      { path: '/user/:id', component: UserView },
      { path: '/', redirect: '/top' }
    ]
  })
}

解决方案

const createListView = id => () => import('../views/CreateListView').then(m => m.default(id))

箭头函数（可以看看阮老师的文章了解下）其实就是

const createListView = function(id) {
     return function () {
         import('../views/CreateListView')
             .then(function(m) {
                 m.default(id)
             });
     }
}

这篇关于javascript - Vue JS语法求解读的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！