Javascript 为什么ComponentUpdate说当前道具是React中的新道具?
我正在使用Redux,但不确定这是否是原因 我有这样的代码Javascript 为什么ComponentUpdate说当前道具是React中的新道具?,javascript,reactjs,redux,Javascript,Reactjs,Redux,我正在使用Redux,但不确定这是否是原因 我有这样的代码 <Page> <AnotherChild /> <Pricing quotes={this.props.item.quotes} /> </Page> 假设输入有10,我突出显示all并按下5,日志显示下一个和当前属性值的5 我不知道这是怎么回事。我想我需要在某个时刻看到10->5的日志,因为它从10开始,不能神奇地从父级切换,对吗 编辑 下面是触发道具更改的代码块 _updat
<Page>
<AnotherChild />
<Pricing quotes={this.props.item.quotes} />
</Page>
假设输入有10
,我突出显示all并按下5
,日志显示下一个和当前属性值的5
我不知道这是怎么回事。我想我需要在某个时刻看到10->5的日志,因为它从10开始,不能神奇地从父级切换,对吗
编辑
下面是触发道具更改的代码块
_updateDiscountAmount() {
var discountAmount = +this.refs.discount_amount.getValue();
var quotes = this.props.quotes.map(quote => {
var promoPrice = quote.value;
if (Number.isNaN(discountAmount)) {
discountAmount = 0;
}
quote.percentage = discountAmount;
promoPrice = (promoPrice - (promoPrice * discountAmount/100)).toFixed(2);
return quote;
});
this.props.dispatch({
type: 'CURRENT_PAGE_UPDATE',
data: {
discount_amount: discountAmount,
quotes
}
});
},
@上面的wintvelt给出了答案,所以如果他把答案写进去,我会记下来 基本上,上面的代码失败了。即使我正在映射到一个新的数组,我也在更改应该是不可变的 我所需要做的就是在修改之前在循环中复制一份
quote
即:
@上面的wintvelt给出了答案,所以如果他把答案写进去,我会记下来 基本上,上面的代码失败了。即使我正在映射到一个新的数组,我也在更改应该是不可变的 我所需要做的就是在修改之前在循环中复制一份
quote
即:
当你的
nextrops
看起来与this.props
相同时,通常你会在某个地方无意中改变props。例如:
// this.props.quotes = [ { discount : 5 }, { discount : 3}];
var quote = this.props.quotes[0];
console.log(quote.discount); // 5
quote.discount = 10; // (!) this also updates props
console.log(this.props.quotes[0].discount); // 10
若要修复,请在更新之前复制对象,如下所示:
var newQuotes = this.props.quotes.map(quote => {
// Copy object
var newQuote = Object.assign({}, quote);
...
newQuote.percentage = discountAmount;
...
return newQuote;
});
当你的
nextrops
看起来与this.props
相同时,通常你会在某个地方无意中改变props。例如:
// this.props.quotes = [ { discount : 5 }, { discount : 3}];
var quote = this.props.quotes[0];
console.log(quote.discount); // 5
quote.discount = 10; // (!) this also updates props
console.log(this.props.quotes[0].discount); // 10
若要修复,请在更新之前复制对象,如下所示:
var newQuotes = this.props.quotes.map(quote => {
// Copy object
var newQuote = Object.assign({}, quote);
...
newQuote.percentage = discountAmount;
...
return newQuote;
});
您是否可以制作一个这样的工作示例,例如在中?这是不正常的behavior@Tyrsius即将离开办公室,这需要一些工作,因为这个例子是在一个有点复杂的应用程序。我想知道是否有什么地方出错了,因为一些数据到目前为止是嵌套的,所以没有被调用,但还有一些东西,我在事件发生后碰巧看到了console.log,但我想我应该注意到,在render中没有看到任何其他控制台日志表明它被某个不太深的东西多次击中。这里有一个显示,它的反应通常会按照您期望的方式进行。你所看到的行为的解释肯定在别处。如果没有更多的代码,我们将无法帮助您。我们无法从您的代码中推断出这一点,但通常情况下,如果您的道具不是完全不变的,则会发生这种情况。例如,如果
this.props.prices
指向一个prices
对象,并且一些foo.prices
指向同一对象。如果随后更新foo.prices[0].value
,您也会无意中改变props
。您能否生成一个这样的工作示例,例如在中?这是不正常的behavior@Tyrsius即将离开办公室,这需要一些工作,因为这个例子是在一个有点复杂的应用程序。我想知道是否有什么地方出错了,因为一些数据到目前为止是嵌套的,所以没有被调用,但还有一些东西,我在事件发生后碰巧看到了console.log,但我想我应该注意到,在render中没有看到任何其他控制台日志表明它被某个不太深的东西多次击中。这里有一个显示,它的反应通常会按照您期望的方式进行。你所看到的行为的解释肯定在别处。如果没有更多的代码,我们将无法帮助您。我们无法从您的代码中推断出这一点,但通常情况下,如果您的道具不是完全不变的,则会发生这种情况。例如,如果this.props.prices
指向一个prices
对象,并且一些foo.prices
指向同一对象。如果您随后更新foo.prices[0].value
,您也会无意中改变道具。