Vue Form - colCountByScreen

Specifies dependency between the screen factor and the count of columns in the form layout.

Selector: DxColCountByScreen
Type:

Object

Default Value: undefined

The following code sample illustrates how to set this property:

App.vue
  • <template>
  • <DxForm ...>
  • <DxColCountByScreen :xs="2"/>
  • </DxForm>
  • </template>
  • <script>
  • import DxForm, { DxColCountByScreen } from 'devextreme-vue/form';
  •  
  • export default {
  • components: {
  • DxForm,
  • DxColCountByScreen
  • }
  • }
  • </script>

View Demo

lg

The count of columns for a large screen size.

Type:

Number

| undefined
Default Value: undefined

md

The count of columns for a middle-sized screen.

Type:

Number

| undefined
Default Value: undefined

sm

The count of columns for a small-sized screen.

Type:

Number

| undefined
Default Value: undefined

xs

The count of columns for an extra small-sized screen.

Type:

Number

| undefined
Default Value: undefined