form-create icon indicating copy to clipboard operation
form-create copied to clipboard

inline模式下antd 的select宽度不正常问题

Open InsHomePgup opened this issue 3 years ago • 2 comments

@form-create/[email protected]

"ant-design-vue": "^1.7.2",

inline模式下的select没有宽度

//实例对象 fApi: {}, //表单数据 value: {}, //表单生成规则 rule: [ { type: 'input', field: 'goods_name', // wrap: { // labelCol: {span:12}, // wrapperCol: {span:12} // }, col:{ span:10 }, props: { placeholder: '111' } // title: '商品名称' }, { type: 'select', // 这个select宽度不正确 field: 'location', // options: [], title:"123123", wrap: { labelCol: {span:12}, wrapperCol: {span:12} }, props: { placeholder: '区域' } }, { type: 'datePicker', field: 'created_at' // title: '创建时间' } ], //组件参数配置 option: { form: { hideRequiredMark: false, layout: 'inline', // 这里用的inline模式 labelAlign: 'right', labelCol: { span: 4 }, wrapperCol: { span: 10 }, wrap: { labelCol: {span:12}, wrapperCol: {span:12} }, colon: undefined, validateOnRuleChange: true }, //表单提交事件 onSubmit: function(formData) { alert(JSON.stringify(formData)) } }

宽度根据全局配置走 wrap: { labelCol: {span:12}, wrapperCol: {span:12} },

InsHomePgup avatar May 07 '21 07:05 InsHomePgup

下下策,全局添加了一个公共类。

.ant-select-selection{ min-width: 200px; }

InsHomePgup avatar May 07 '21 07:05 InsHomePgup