Nuxt с Markdown, расширить полученный компонент с помощью пользовательских функций - PullRequest
Новая
       15

Nuxt с Markdown, расширить полученный компонент с помощью пользовательских функций

0 голосов
/ 11 апреля 2020

Я застрял, пытаясь расширить сгенерированный Vue компонент с помощью пользовательских функций.

Вот что я сделал до сих пор:

В nuxt.config. js: 

config.module.rules.push({
    test: /\.md$/,
    include: path.resolve(__dirname, "content"),
    loader: 'frontmatter-markdown-loader',
    options: {
      mode: [FMMode.VUE_COMPONENT],
      vue: {
        root: 'markdown' // The class name of the root div
      }
    }
  });

// На моей странице: 

// in asyncData({ params }) :
let post = await import(`~/content/posts/${params.slug}`);

    post.vue.component.methods = {
      custom_func () {
        return 'Processed!'
      }
    }

    return {
      post: {
        attributes: post.attributes,
        component: post.vue.component
      }
    }

// And in template :

<component :is="post.component" />

Это должно сработать, но я получаю следующие ошибки: 


     WARN  Cannot stringify a function data                               12:23:35


     WARN  Cannot stringify a function render                             12:23:35


     WARN  Cannot stringify a function created                            12:23:35


     WARN  Cannot stringify a function image_tag                          12:23:35


     WARN  Cannot stringify a function VueComponent

В идеале я хотел бы иметь пользовательский компонент в ./components/, где я внедряю сгенерированную уценку, которая содержит вызов функций (например, {{ custom_func(...) }}), и результат будет отображаться правильно.

Я думаю, что я близок здесь (хотя У меня нет пользовательского компонента), но я не знаю, почему Nuxt хочет все упорядочить ...

Спасибо за вашу помощь!

...