React Context中区块链Campaign数组过滤无结果问题排查

可能的原因及对应解决方法 #

1. 地址大小写不一致 #

区块链地址本身大小写不敏感，但字符串比较是严格大小写匹配的。比如0xAbC123...和0xabc123...在区块链中是同一个地址，但直接字符串对比会返回false。

• 解决：将两个地址统一转为小写（或大写）后再比较：

const getUserCampaigns = () => {
  return campaigns.filter(campaign => 
    campaign.owner.toLowerCase() === account.toLowerCase()
  );
};

2. 地址前后存在隐形空白字符 #

从区块链接口解析的campaign.owner或从钱包获取的account，可能带有看不见的空格、换行符等空白字符，导致表面看起来一致的字符串实际不相等。

• 解决：先用trim()去除前后空白，再结合大小写转换：

const getUserCampaigns = () => {
  return campaigns.filter(campaign => 
    campaign.owner.trim().toLowerCase() === account.trim().toLowerCase()
  );
};

3. 地址前缀不一致 #

部分场景下，获取的地址可能存在0x前缀缺失的情况（比如abc123...和0xabc123...），直接对比会不相等。

• 解决：统一处理地址前缀，确保格式一致：

// 工具函数：标准化地址格式
const normalizeAddress = (addr: string) => {
  const trimmedAddr = addr.trim().toLowerCase();
  return trimmedAddr.startsWith('0x') ? trimmedAddr : `0x${trimmedAddr}`;
};

// 过滤逻辑
const getUserCampaigns = () => {
  const normalizedAccount = normalizeAddress(account);
  return campaigns.filter(campaign => 
    normalizeAddress(campaign.owner) === normalizedAccount
  );
};

4. 数据解析阶段的隐形错误 #

在getCampaigns函数解析区块链数据时，owner字段可能被意外截断、编码错误，导致存储的地址和实际链上地址不符。

• 解决：在getCampaigns中添加调试日志，对比原始数据：

const getCampaigns = async () => {
  // ...原有获取逻辑
  const rawCampaigns = await fetchBlockchainData();
  // 打印原始数据对比
  console.log('链上返回的owner地址:', rawCampaigns.map(c => c.owner));
  console.log('当前钱包account:', account);
  // ...解析并保存到state
};

如果日志显示地址确实不一致，需要检查区块链数据读取、合约调用或解析逻辑是否存在错误。

内容的提问来源于stack exchange，提问作者0xhaz