How to change the `attrs` prop name

[avaldevilap]

In my current project, we're already using the prop name of blok. There's any way in the configuration for changing the prop attrs by blok?

<template>
  <div v-editable="blok" class="divider" />
</template>

<script>
export default {
  props: {
    blok: {
      type: Object,
      required: true,
    },
  },
};
</script>

[SebbeJohansson]

Hi. Did you create this issue in the wrong repo? This is specifically for the rich-text-renderer that @m4rvr has created. From your comment, it looks like you are talking about the storyblok components rather than the renderer?

[avaldevilap]

I'm having trouble rendering components inside of rich text renderer

[SebbeJohansson]

@avaldevilap Wouldnt that be related to these? https://github.com/m4rvr/storyblok-rich-text-renderer/pull/15 https://github.com/m4rvr/storyblok-rich-text-renderer/issues/6

[DEV-ONI]

I'm having the same issue.

The problem is the prop is passed as attrs described in the first part of https://storyblok-rich-text-renderer.netlify.app/vue-plugin/resolvers/: (Every component gets an attrs prop value which contains the attributes (if there are any) from Storyblok like the level of your HEADING or the src of your IMAGE. ✌️)

so if your accepts a prop blok instead of a prop named attrs, you get an error that the component expects a prop named blok

We're wondering if there's a way to change the prop name passed to components that wouldn't require a rewrite to adhere to just this plugin.

[jony1993]

We're having the same issue. Has anyone already found a workaround? :)

[SebbeJohansson]

@jony1993 i managed to work around the issue of rendering components in richtext with this solution: https://gist.github.com/SebbeJohansson/31b64c5c4f914abfec2660210ec7795a