jimmychu0807

# -- 安装 NodeJS v12 (https://nodejs.org/en/download/),
#   及 yarn 工具 (https://classic.yarnpkg.com/en/docs/install)

# -- 下载 Substrate 前端模版并跑起来
cd ..
git clone https://github.com/substrate-developer-hub/substrate-front-end-template front-end-template
cd front-end-template
yarn install
yarn start

jimmychu0807

{
  "PROVIDER_SOCKET": "ws://<你的 ws/wss 地址>"
}

jimmychu0807

api.query.<pallet_名字>.<pallet 存储名字>(回调函数)

jimmychu0807

let unsubscribe;
api.query.templateModule.something(function(val) {
  // 回调函数
  // 在这里设置 UI 里使用的变量。
}).then(unsub => {
  //取消订阅函数
  unsubscribe = unsub;
})

jimmychu0807

{
  //外部交易函数
  //  这个参看回 `pallet/template/src/lib.rs` 的名字
  tx: api.tx.<模块名字>.<extrinsic 名字>
  //外部交易函数的输入参数数组
  params: [...]
}

jimmychu0807

useEffect(() => {
  let unsubscribe;
  api.query.templateModule.something(newValue => {
    // The storage value is an Option<u32>
    // So we have to check whether it is None first
    // There is also unwrapOr
    if (newValue.isNone) {
      setCurrentValue('<None>');
    } else {
      setCurrentValue(newValue.unwrap().toNumber());

jimmychu0807

const accountPair = keyring.getPair(accountAddress);

jimmychu0807

target/release/node-template purge-chain --dev

jimmychu0807

api.tx.my_pallet.dispatch_call(params).signAndSend(accountPair, 回调函数)

jimmychu0807

//...
import { SubstrateContextProvider, useSubstrate } from './substrate-lib';
import { DeveloperConsole } from './substrate-lib/components';

//...
function Main() {
  const [accountAddress, setAccountAddress] = useState(null);
  const { apiState, keyring, keyringState } = useSubstrate();
  const accountPair =
    accountAddress &&