react|react antd 联动下拉框组数据和回显问题 reactantd联动下拉框组数据和回

1.新增

{getFieldDecorator("name", { initialValue: data.name, rules: [ { required: true, message: "会议室指引图名称不为空", }, ], })()} {/* build_floor_ids是一个数组里面包含着大厦id 和楼层id */} {getFieldDecorator("build_floor_ids", { initialValue: data.build_floor_ids, rules: [ { type: "array", required: true, message: "大厦不为空", }, { validator: (rule, value, callback) => { let record = getFieldValue("build_floor_obj"); // console.error("-11--", value, record); if (record.type === "b") { callback("未配置楼层"); } callback(); }, }, ], })( // 新增编辑 -大厦下拉框列表 { // 把选择完的大厦-楼层的楼层id给了 record，selectedOptions.length - 1减一代表只传一个楼层id let record = selectedOptions[selectedOptions.length - 1]; // ==b代表代表已经选了楼层 if (record.type !== "b") { // console.error(record, record?.id); // 请求接口的时候把楼层id给了original_idrecord?.id这种是高级写法，代表着从record中拿到id FloorguideAction.floorGuideList({ original_id: record?.id, }).then((results) => { if (!results.success) { message.error(results.err_msg || "接口错误", 0.5); return; } // 最后判断有图片就展示图片没有就继续展示默认icon this.props.toggleBackUrl && this.props.toggleBackUrl(results?.data?.photo_url); }); }setFieldsValue({ build_floor_obj: record, build_floor_id: record?.id, }); }} /> )}

【react|react antd 联动下拉框组数据和回显问题】2.编辑

state = { data: {} }; componentDidMount() { this.init(); }init = () => { let { location = {} } = this.props; let { query = {} } = location; let { id } = query; if (id) { FloorguideAction.floorGuideMeetingFindById({ id, }).then((results) => { if (!results.success) { message.error(results.err_msg || "接口错误", 0.5); return; } let { data = {} } = results; if (_.isEmpty(data)) { return; } this.setState({ data: { // id, ...data, // 这是回显的两个联动的下拉框组建的数据大厦id 楼层id build_floor_ids: [ data.build_id, //接口获取的大厦id data.build_floor_id, //接口获取的楼层id build_floor_id ], }, }); }); } }; render() { let { data = {} } = this.state; return ; }