我正在为我的项目使用Redux-Form 6.8.0。我正在创建旅行应用程序，计算旅行的距离和持续时间。旅行可以有一个或多个站点。可以从Google Place AutoComplete中选择停靠点 并从谷歌地方应用程序中选择所需的地点应用程序计算距离Google Direction Service。
我设法在用户从下拉列表中选择位置时执行所有计算，但是当用户交换停止/字段（使用fields.swap(indexA:Integer, indexB:Integer)时）显示不正确的结果。内部计算方法I＆＃34;调试＆＃34;值和当用户执行字段交换时，值（索引）根本不会改变，但字段数组更改会正确呈现。
另外，我在redux-form商店中添加了新元素，因为我需要提交一些值，即使它们根本没有字段。不确定这是不是很好的方法，所以我愿意接受建议。
有人知道问题出在哪里吗？
这是我的代码：
价格计算：
updateStopDistanceAndTime = () => {
let self = this;
if (this.props.fields.length >= 2) {
let waypoints = [];
this.props.fields.getAll().map(function (value, index) {
console.log(value);
if (value.place) {
waypoints.push({
place: value.place,
placeId: value.placeId
});
}
});
calculateTimeAndValueBetweenStops(waypoints).then(function (result) {
if (Object.keys(result).length > 0) {
let currentValues;
result.map(function (value, index) {
currentValues = self.props.fields.get(index);
if (value.end_address !== value.start_address) {
currentValues.distance = value.distance;
currentValues.duration = value.duration;
// self.props.changeFieldValue('busRentForm', index + ".distance", value.distance);
// self.props.changeFieldValue('busRentForm', index + ".duration", value.duration);
}
else {
// self.props.changeFieldValue('busRentForm', index + ".distance", null);
// self.props.changeFieldValue('busRentForm', index + ".duration", null);
currentValues.distance = null;
currentValues.duration = null;
}
self.props.fields.remove(index);
self.props.fields.insert(index, currentValues);
});
}
});
}
}
Field Array：
render() {
const {
stop,
index,
dayIndex,
fields,
isDragging,
connectDragSource,
connectDropTarget,
} = this.props
return connectDragSource(connectDropTarget(
<div key={index} className="">
<div>
<div className="col-md-6 col-xs-7">
<Field name={`${stop}.place`}
type="text"
component={renderStopInput}
icon={String.fromCharCode(97 + index)} // (97) is A in ascii table
label={(index === 0) ? "Starting location" : (index === fields.length - 1) ? "Destination location" : "Stop location"}
placeholder=""
index={index}
/>
<span className={index !== fields.length - 1 ? "vertical-dash" : null}></span>
{(index !== 0 && index !== fields.length - 1) ?
<button className="btn btn-fab btn-rearrange" type="button" onClick={() => {
fields.swap(index, index + 1);
}}><i className="fa fa-exchange"></i></button>
:
null}
</div>
<div className="col-md-1 stack">
{(index !== fields.length - 1 && index !== 0) ?
<button className="btn-remove" type="button" onClick={() => fields.remove(index)}>
<span className="icon-Cancel"></span>
</button>
: null}
</div>
{(index !== fields.length - 1 && fields.get(index)) ?
<StopInfo
departureTime={fields.get(index).time }
distance={fields.get(index).distance}
duration={fields.get(index).duration}
/>
: null}
</div>
</div>
));
}