Berikut ialah kesan dinamik ringkas yang ditulis dalam tindak balas, tetapi beberapa bahagian tidak jelas. Mengapa kita perlu menambah bind(ini) pada penghujung pemasa Apakah fungsinya?
var Hello = React.createClass({
getInitialState: function () {
return {
opacity: 1.0
};
},
componentDidMount: function () {
this.timer = setInterval(function () {
var opacity = this.state.opacity;
opacity -= .05;
if (opacity < 0.1) {
opacity = 1.0;
}
this.setState({
opacity: opacity
});
}.bind(this), 100);
},
render: function () {
return (
<p style={{opacity: this.state.opacity}}>
Hello {this.props.name}
</p>
);
}
});
ReactDOM.render(
<Hello name="world"/>,
document.body
);
Dua mata ilmu:
ikat()
ini menunjuk kepada
Khusus untuk contoh ini, jika anda tidak menggunakan
bind()
而直接调用 setInterval 中定义的匿名函数,函数内部的 this 是指向 window 对象的。匿名函数内部显然需要 this 指向当前组件,才能读取state
属性/调用setState()
方法,所以使用bind()
untuk mengikat fungsi tanpa nama kepada persekitaran pelaksanaan semasa ini, iaitu komponen semasa.Anda hanya perlu membezakan beberapa perkara berikut untuk mengetahui.
1.bind(this)Apakah maksud ini?
2. Apabila bind(ini) tidak digunakan, apakah yang dimaksudkan dalam fungsi ini apabila panggilan balik dilaksanakan.
3 Selepas mengikat(ini), apabila panggilan balik dilaksanakan, apakah yang dimaksudkan dalam fungsi ini.