Dexie.jsでReactjを使用していますか？

Question

私はデータベースの値に反応状態を設定する方法を理解しようとしています。私はDexie.jsを使用しています。

var Duck = React.createClass({ 
getInitialState:function(){ 
return { century:'' } 
}, 

fridge:function(){ 

var db = new Dexie('homie'); 
db.version(1).stores({ 
friends:'name, race'}); 

db.open().catch(function(){ 
alert("Open failed: "); 
}); 

db.friends.put({name: 'Johnny', race:'hispanic'}).then(function(){ 
return db.friends.get('Johnny'); 
}).then(function(samba){ 
console.log(samba.race); 
this.setState({century: samba.race}); 
}); 
}, 

render:function(){ 
return (<div> 
<input type="submit" value="Submeet" onClick={this.fridge} /> 
<p>{this.state.century}</p> 
</div>); 
} 

機能は、データベースに適切な項目を配置するので機能します。動作しないコードの唯一の部分はthis.setState({century:samba.race})です。これにより、エラーはCannot read property 'setState' of undefinedになります。

setStateをデータベースから取り込むにはどのようにすればよいですか？

Answer 1

この問題は、Dexie.js（素晴らしいindexDBラッパーbtw）とは関係ありません。ハンドラとして.thenに渡すコールバックからthis.setState()を呼び出します。約束のコンテキスト内でコールバックが呼び出されたときthisはundefinedです。あなたが明示的に.bindまたは古いthat = thisを使用して、コールバックのthisを設定する必要があることを解決するため、または単に矢印機能（demo）を使用するには

：

.then((samba) => { 
    console.log(samba.race); 
    this.setState({ 
     century: samba.race 
    }); 
    });