col-num not working

[V-yw]

• Browser Google Chrome 118.0.5993.117
• Vue Version Vue.js v2.7.14
• vue-grid-layout Version: vue-grid-layout - 2.4.0

When I set colNum to 12 columns, it has no effect. I opened Google's vue plug-in and checked that clos is automatic. Below is an example of part of my code.But it works if I adjust row-height

<grid-layout ref="gridlayout"
:layout.sync="layout"
:col-num="12"
{# :cols="12"#}
:row-height="30"
:is-draggable="true"
:is-resizable="true"
:is-mirrored="false"
:vertical-compact="true"
:margin="[10, 10]"
:responsive="true"
:use-css-transforms="true"
class="vue-grid-layout"
>