Question

我对React和Solidity还是陌生的，但是我只是为了学习而做一个项目，但是我不明白如何创建Solidity项目的React前端。

pragma solidity^0.5.0;
pragma experimental ABIEncoderV2;

contract I2Chain {

     event FileChained(string checksum, 
     address indexed user, 
     uint timestamp,
     uint fileSize, 
     uint fileTimestamp, 
     string fileType, 
     string fileName);

    event FileShared(string checksum, 
    address indexed user,  
    address indexed recipient,
    uint attributes, 
    uint tenure, 
    uint timestamp);

event FileRead(string checksum, address indexed user, uint timestamp);

event FileDeleted(string checksum, 
address indexed user,
uint timestamp);

event PubKeyUpdate(address indexed user, string pubKey);

mapping(address => string) public publicKeys;

function PublishFile(string memory _checksum,
uint _fileSize,
uint _fileTimestamp, 
string memory _fileType,
string memory _fileName) 
public {

 emit FileChained(_checksum, msg.sender, now, 
 _fileSize,_fileTimestamp, _fileType, _fileName);
}

function ShareFile(string memory _checksum, address _recipient, 
uint _attributes, 
uint _tenure) public {

emit FileShared(_checksum, msg.sender, _recipient, _attributes, 
_tenure, now);
}

function ReadFile(string memory _checksum) public {
    emit FileRead(_checksum, msg.sender, now);
}

function DeleteFile(string memory _checksum) public {
    emit FileDeleted(_checksum, msg.sender, now);
}

function setPublicKey(string memory _pubKey) public {
    publicKeys[msg.sender] = _pubKey;
    emit PubKeyUpdate(msg.sender, _pubKey);
}

function getPublicKey(address _user) 
view public returns(string memory)  {

return publicKeys[_user];
  }
}

我已将合同部署到松露中并生成合同的ABI，但是我不知道如何使用此ABI创建前端。注意：p 当我部署到remix IDE时，我将获得所有功能接口（请参阅附件enter image description here

请提出建议并帮助我如何为该合同的所有功能创建UI，以便用户可以完整地使用我的智能合同和区块链？

Answer 1

如果您对这两者都不熟悉，我认为您应该遵循本教程，在此教程中他们使用drizzel将区块链与前端连接。

https://truffleframework.com/tutorials/getting-started-with-drizzle-and-react

构建以太坊智能合约的React前端

1 个答案: