'vuejs antdesign popover max width

Unable to set maxWidth on popover element from ant design for vuejs. I've tried:

<a-popover 
    placement="rightTop" 
    trigger="hover" 
    overlayStyle="{maxWidth: 123px}"
>

failing with:

runtime-dom.esm-bundler.js?2725:169 Uncaught (in promise) TypeError: Failed to set an indexed property on 'CSSStyleDeclaration': Indexed property setter is not supported.
vue.jsvuejs3antdant-design-pro


Solution 1:[1]

According to the relevant documentation, overlayStyle expects an object.
You're passing a string (all HTML attribute values are strings), but in Vue you can interpolate js using :stuff="/* js here */" (shorthand for v-bind:stuff="/* js here */")

This should work:

<a-popover
  placement="rightTop" 
  trigger="hover" 
  :overlayStyle="{ maxWidth: '123px' }" />
 ??                         ??   ??

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1

Related Questions