form-create
form-create copied to clipboard
inline模式下antd 的select宽度不正常问题
@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} },
下下策,全局添加了一个公共类。
.ant-select-selection{ min-width: 200px; }