Объясните компонент vue-router как функцию

Я не знаю остального вашего кода, но похоже, что это может быть реализация vue-router функция отложенной загрузки. По сути, Vue + Webpack разделит ваш код на фрагменты и будет загружать только эти фрагменты всякий раз, когда пользователь пытается перейти по этим маршрутам, вместо того, чтобы загружать их все и создавать более крупный пакет для загрузки, чем необходимо.

When building apps with a bundler, the JavaScript bundle can become quite large, and thus affect the page load time. It would be more efficient if we can split each route's components into a separate chunk, and only load them when the route is visited.

Combining Vue's async component feature and webpack's code splitting feature, it's trivially easy to lazy-load route components.

Во Vue компонент создается с использованием объекта, содержащего его конфигурацию.

Самый простой из возможных компонентов может выглядеть примерно так

componentConfig = {
    template: '<div>test</div>'
};    
Vue.component('test', componentConfig);

В некоторых случаях разработчик может не захотеть использовать template и захочет создать элемент с нуля, используя чистый Javascript. Вот тут и пригодится функция рендеринга.

Vue recommends using templates to build your HTML in the vast majority of cases. There are situations however, where you really need the full programmatic power of JavaScript. That’s where you can use the render function, a closer-to-the-compiler alternative to templates.

from https://vuejs.org/v2/guide/render-function.html#Basics

Чтобы изменить приведенный выше пример на использование функции рендеринга:

componentConfig = {
    render: function(createElement) {
        return createElement('div', 'test')
    }
};
Vue.component('test', componentConfig);

Они дадут точно такой же результат:

• https://codepen.io/jacobgoh101/pen/ZoKwKb?editors=1010
• https://codepen.io/jacobgoh101/pen/PemVmy?editors=1010

Другими словами, render function - это просто альтернатива использованию template.

{
    component: {
        render(c) {
            return c('router-view')
        }
    }
}

равно

{
    component: {
        render(createElement) {
            return createElement('router-view')
        }
    }
}

равно

{
    component: {
        template: `<router-view></router-view>`
    }
}

Поскольку функция рендеринга - closer-to-the-compiler, она быстрее по сравнению с использованием шаблона. Наверное, поэтому автор вашего кода так поступает.