Truffle
在 React 中使用 Drizzle 庫時遇到問題
使用 Ubuntu 16.04
問候,我一直在關注這裡的 Drizzle 啟動和執行教程。當我嘗試從終端使用“npm start”命令執行應用程序時,我進入了這一步。然後,我收到一個錯誤消息“TypeError:毛毛雨未定義”。我通過 npm 更新軟體包後再次嘗試,但錯誤仍然存在。我已經複製了我在下面使用的程式碼:
應用程序.js:
import React, { Component } from 'react'; import logo from './logo.svg'; import './App.css'; class App extends Component { state = { loading: true, drizzleState: null }; componentDidMount() { const { drizzle } = this.props; // subscribe to changes in the store this.unsubscribe = drizzle.store.subscribe(() => { // every time the store updates, grab the state from drizzle const drizzleState = drizzle.store.getState(); // check to see if it's ready, if so, update local component state if (drizzleState.drizzleStatus.initialized) { this.setState({ loading: false, drizzleState }); } }); } compomentWillUnmount() { this.unsubscribe(); } render() { if (this.state.loading) return "Loading Drizzle..."; return <div className="App">Drizzle is ready</div>; } } export default App;
index.js
import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; import App from './App'; import registerServiceWorker from './registerServiceWorker'; // import drizzle functions and contract artifact import { Drizzle, generateStore } from "drizzle"; import 'contract_name' from "./contracts/'contract_name'.json"; ReactDOM.render(<App />, document.getElementById('root')); registerServiceWorker(); // let drizzle know what contracts we want const options = { contracts: ['contract_name'] }; // setup the drizzle store and drizzle const drizzleStore = generateStore(this.props.options); const drizzle = new Drizzle(this.props.options, drizzleStore);
出於隱私原因,我用“contract_name”替換了我正在使用的契約的實際名稱。有什麼明顯的我做錯了嗎?
在您的 index.js 文件中,您需要將 drizzle 實例作為道具傳遞給 App 組件:
ReactDOM.render(<App drizzle={drizzle} />, document.getElementById("root"));
你還應該在 ReactDOM.render 之前聲明你的常量:
... // let drizzle know what contracts we want const options = { contracts: [MyStringStore] }; // setup the drizzle store and drizzle const drizzleStore = generateStore(options); const drizzle = new Drizzle(options, drizzleStore); // pass in the drizzle instance ReactDOM.render(<App drizzle={drizzle} />, document.getElementById("root")); registerServiceWorker();