Overriding VNode data from a render function

What would be a good way to overwrite some of the vnode options, like props or event handlers, from a render function. I’d like to extend the functionality of the provided vnode, but the vnode should function just as normal to the user of the component. If I override the click listener for example, I need to somehow invoke the original so that they can react to it. Here is how I’m overriding the click listener currently:

const node = this.$slots.default[0]
const data = node.data || {}
const originalClick = (data.on || {}).click

data.on = {
    ...(data.on || {}),
    click: (evt) => { 
        originalClick && originalClick(evt)

node.data = data

return h('li', [ node ])

Is there something wrong with this or an alternative approach?
In the case of overriding props, I don’t want to keep the original ones ( the user will not be supposed to use the specific prop on my component, so I don’t care if they passed it or not, I want to override it ). A use case would be to have like a list of buttons and one of them can be active based on the index, but the button itself doesnt know its index in the parent component, but the parent component does, so I’d like to do something like

const activeIndex = 0 // maybe it is provided to this component from one of the parents?

 return this.$slots.default.map((node, index) => {
   node.componentOptions.propsData.active = activeIndex === index
     return node

Last time I tried to do something similar to this, but I don’t remember the exact code, and it worked, but consecutive renders of the parent component didn’t render the children properly, like the active property was not working correctly.

Are there any caveats I should keep in mind when doing something like this or a manual cleanup I need to do to avoid memory leaks?