vue-2-breadcrumbs

vue-2-breadcrumbs copied to clipboard

Hi, thanks for this awesome lib!

My question is how to use in async way.

Lets say, Breadcrumb is to a product page and I want to show the product name

home -> category -> product name

Something like this (ie)

meta: {
  async breadcrumb() {
  const { data } = await api.get('product');
  const name = data.name;
  return {
    label: name
  };
  }
}

How to do that, if possible ?

@re2005 Hi, thanks for an interesting idea, but I'll try to figure out how to do it. If you have any ideas, feel free to submit them. PR are also welcomed

Can u accept a promise inside the component:

const label = this.getBreadcrumb(crumb.meta.breadcrumb);

There's an async approach for handling promises. I tried but not there yet.

Vue.component('async-example', function (resolve, reject) {
  setTimeout(function () {
    // Pass the component definition to the resolve callback
    resolve({
      template: '<div>I am async!</div>'
    })
  }, 1000)
})

So far, I do not see opportunities to implement this for several reasons:

1. The router does not work with promises
2. Rendering doesn't work with promises

Either I have not completely figured out the ecosystem vue and vue-router

Thanks for the feedback. Maybe on Vue3 this is something that will work.

I've also tried but didn't succeed.

Keep u posted if any update on my side.

Thanks

I'm not that deep into vue, but maybe it's an idea to use a similar logic like the vue-meta plugin. So that a child component can export certain fields to overwrite template strings in the parents. https://github.com/nuxt/vue-meta

I'm not that deep into vue, but maybe it's an idea to use a similar logic like the vue-meta plugin. So that a child component can export certain fields to overwrite template strings in the parents. https://github.com/nuxt/vue-meta

Thanks anyway, I'll look into this pack!