`npm i antd-form-search
import FormSeach from 'antd-form-search'
<FormSeach
formData={data}
col={3}
onSeach={(seachData)=>{
this.seachlist(seachData)
}}
onReset={(seachData)=>{
this.seachlist(seachData)
}}
></FormSeach>
整体参数格式
type // 类型 必传 String
label // label 必传 String
value // 返回参数key 必传 String
defaultValue // 默认值 非必传 String || data || [] || {}
defaultAttribute // 支持antd默认参数 非必传 {}
输入框 参数及示例
{
type:"input",
label:'输入框',
value:'orderSn',
// defaultValue:'123',
defaultAttribute:{
placeholder:'输入框11',
}
},
日期 参数及示例
defaultValue 传 moment('2019-11-11') 格式
{
type:"dataPicker",
label:'日期',
value:'dataPicker',
// defaultValue:moment('2019-11-11'),
defaultAttribute:{
placeholder:'请选择日期',
}
},
月份 参数及示例
defaultValue 传 moment('2019-11-11') 格式
{
type:"monthPicker",
label:'月份',
value:'monthPicker',
// defaultValue:moment('2019-11-11'),
defaultAttribute:{
placeholder:'请选择月份',
}
},
双日历 参数及示例 两个单独的日历组成的双日历
defaultValue 传 [moment('2019-11-11'),moment('2019-11-15')] 格式
value 需要传两个参数 逗号隔开'towdatapickerStart1,towdatapickerEnd1' 用来接收选中的两个时间
{
type:"twoDataPicker",
label:'双日历',
value:'towdatapickerStart1,towdatapickerEnd1',
// defaultValue:[moment('2019-11-11'),moment('2019-11-15')],
defaultAttribute:{
placeholder:['开始日期','结束日期'],
}
},
双日历 参数及示例 rangePicker
defaultValue 传 [moment('2019-11-11'),moment('2019-11-15')] 格式
value 需要传两个参数 逗号隔开'rangepickerStart1,rangepickerEnd1' 用来接收选中的两个时间
{
type:"rangePicker",
label:'双日历',
value:'rangepickerStart1,rangepickerEnd1',
// defaultValue:[moment('2019-11-11'),moment('2019-11-15')],
defaultAttribute:{
placeholder:['开始日期','结束日期'],
}
},
普通下拉选择框 参数及示例
data 传 [{value:'',label:'全部'},{value:'1',label:'待审核'},{value:'2',label:'已审核'},{value:'3',label:'已拒绝'}], 数组
每一项的 key 都为 label,value
不传data的话可传dataDom
dataDom:companyNameChildren, // 例 const companyNameChildren = companyNameData.map(d => <Option key={d} value={d}>{d}</Option>);
配和 isAll 使用可在选项中增加全部选项
{
type:"select",
label:'select',
value:'status',
// defaultValue:'1',
data:[{value:'',label:'全部'},{value:'1',label:'待审核'},{value:'2',label:'已审核'},{value:'3',label:'已拒绝'}],
// dataDom:companyNameChildren, // 例 const companyNameChildren = companyNameData.map(d => <Option key={d} value={d}>{d}</Option>);
// isAll:true, // 是否添加全部选项 与dataDom 配和使用 单独使用不生效
defaultAttribute:{
placeholder:'select',
}
},
带搜索的下拉单选 参数及示例
seachSelectRadioData 参数为 [{value:'11',label:'全部'},{value:'1',label:'待审核'},{value:'2',label:'已审核'},{value:'3',label:'已拒绝'}],数组
onSearch 输入框输入内容回调 需要返回新的 seachSelectRadioData 数组
{
type:"searchSelectRadio",
label:'下拉单选',
value:'statusradio',
data:seachSelectRadioData,
onSearch:this.onSeachSelectRadio.bind(this),
// defaultValue:'11',
defaultAttribute:{
placeholder:'带搜索的下拉单选',
}
},
带搜索的下拉多选 参数及示例
seachSelectRadioData 参数为 [{value:'11',label:'全部'},{value:'1',label:'待审核'},{value:'2',label:'已审核'},{value:'3',label:'已拒绝'}],数组
onSearch 输入框输入内容回调 需要返回新的 seachSelectRadioData 数组
defaultValue 默认选中 传 ['11','2'] 数组
maxTagCount 最大显示数量
{
type:"searchSelectCheckbox",
label:'下拉多选',
value:'statuscheckbox',
data:seachSelectRadioData,
onSearch:this.onSeachSelectRadio.bind(this),
// defaultValue:['11','2'],
defaultAttribute:{
placeholder:'带搜索的下拉多选',
maxTagCount:2,
}
},
级联选择 参数及示例
cascaderData = [
{
value: '1',
label: 'Zhejiang',
children: [
{
value: '11',
label: 'Hangzhou',
children: [
{
value: '111',
label: 'West Lake',
},
],
},
],
},
{
value: '2',
label: 'Jiangsu',
children: [
{
value: '21',
label: 'Nanjing',
children: [
{
value: '22',
label: 'Zhong Hua Men',
},
],
},
],
},
];
seachSelectRadioData antd组件数据类型
defaultValue:['2','21','22'],
{
type:"cascader",
label:'级联选择',
value:'cascader1',
data:cascaderData,
// defaultValue:['2','21','22'],
defaultAttribute:{
placeholder:'级联选择',
}
},
金额范围 参数及示例
value:'amount1,amount2', 两个参数逗号隔开 用来接收最小最大值
defaultValue:['1','100'],
{
type:"amountRange",
label:'金额范围',
value:'amount1,amount2',
// defaultValue:['1','100'],
defaultAttribute:{
placeholder:['1','1000'],
}
},
省市区 参数及示例
regions = addressdata.data[0].children; 统一接口返回数据取第1个的children 过滤掉国
defaultValue:{
cityId:52,
cityName:"北京",
districtId:517,
districtName:"延庆区",
provinceId:2,
provinceName:"北京",
},
{
type:"regionSelect",
label:'省市区',
value:'value',
data:regions,
// defaultValue:{
// cityId:52,
// cityName:"北京",
// districtId:517,
// districtName:"延庆区",
// provinceId:2,
// provinceName:"北京",
// },
defaultAttribute:{
placeholder:'请选择省市区',
}
},
整体参数格式
let data = [{
type:"input",
label:'输入框',
value:'orderSn',
// defaultValue:'123',
defaultAttribute:{
placeholder:'输入框11',
}
},{
type:"dataPicker",
label:'日期',
value:'dataPicker',
// defaultValue:moment('2019-11-11'),
defaultAttribute:{
placeholder:'请选择日期',
}
},{
type:"monthPicker",
label:'月份',
value:'monthPicker',
// defaultValue:moment('2019-11-11'),
defaultAttribute:{
placeholder:'请选择月份',
}
},{
type:"twoDataPicker",
label:'双日历',
value:'towdatapickerStart1,towdatapickerEnd1',
// defaultValue:[moment('2019-11-11'),moment('2019-11-15')],
defaultAttribute:{
placeholder:['开始日期','结束日期'],
}
},{
type:"rangePicker",
label:'双日历',
value:'rangepickerStart1,rangepickerEnd1',
// defaultValue:[moment('2019-11-11'),moment('2019-11-15')],
defaultAttribute:{
placeholder:['开始日期','结束日期'],
}
},{
type:"select",
label:'select',
value:'status',
// defaultValue:'1',
data:[{value:'',label:'全部'},{value:'1',label:'待审核'},{value:'2',label:'已审核'},{value:'3',label:'已拒绝'}],
// dataDom:companyNameChildren, // 例 const companyNameChildren = companyNameData.map(d => <Option key={d} value={d}>{d}</Option>);
// isAll:true, // 是否添加全部选项 与dataDom 配和使用 单独使用不生效
defaultAttribute:{
placeholder:'select',
}
},{
type:"searchSelectRadio",
label:'下拉单选',
value:'statusradio',
data:seachSelectRadioData,
onSearch:this.onSeachSelectRadio.bind(this),
// defaultValue:'11',
defaultAttribute:{
placeholder:'带搜索的下拉单选',
}
},{
type:"searchSelectCheckbox",
label:'下拉多选',
value:'statuscheckbox',
data:seachSelectRadioData,
onSearch:this.onSeachSelectRadio.bind(this),
// defaultValue:['11','2'],
defaultAttribute:{
placeholder:'带搜索的下拉多选',
maxTagCount:2,
}
},{
type:"cascader",
label:'级联选择',
value:'cascader1',
data:cascaderData,
// defaultValue:['2','21','22'],
defaultAttribute:{
placeholder:'级联选择',
}
},{
type:"amountRange",
label:'金额范围',
value:'amount1,amount2',
// defaultValue:['1','100'],
defaultAttribute:{
placeholder:['1','1000'],
}
},
{
type:"regionSelect",
label:'省市区',
value:'value',
data:regions,
// defaultValue:{
// cityId:52,
// cityName:"北京",
// districtId:517,
// districtName:"延庆区",
// provinceId:2,
// provinceName:"北京",
// },
defaultAttribute:{
placeholder:'请选择省市区',
}
},
];
{
"orderSn":"123",
"dataPicker":1575993599000,
"monthPicker":1575129599999,
"status":"1",
"statusradio":"1",
"statuscheckbox":["2"],
"cascader1":["2","21","22"],
"value":{
"provinceId":3,
"provinceName":"安徽",
"cityId":36,
"cityName":"安庆",
"districtId":400,
"districtName":"宜秀区"
},
"towdatapickerStart1":1575907200000,
"towdatapickerEnd1":1577375999000,
"rangepickerStart1":1575907200000,
"rangepickerEnd1":1576857599000,
"amount1":"1",
"amount2":"2"
}
const promise = new Promise((resolve, reject) => { console.log(1) resolve() console.log(2) }) promise.then(() => { console.log(3) }) console.log(4)
let a; const b = new Promise((resolve, reject) => { console.log('promise1'); resolve(); }).then(() => { console.log('promise2'); }).then(() => { console.log('promise3'); }).then(() => { console.log('promise4'); });
a = new Promise(async (resolve, reject) => { console.log(a); await b; console.log(a); console.log('after1'); await a resolve(true); console.log('after2'); });
console.log('end');
test() console.log(a) var a = '11111' function test(){ console.log('2222222') }