查看web3应用程序上过去事件的已确认与会者；Javascript；从React和阿波罗客户端导入-如何修复代码中的语法错误
查看web3应用程序上过去事件的已确认与会者；Javascript；从React和阿波罗客户端导入-如何修复代码中的语法错误
提问于 2022-09-13 02:48:12
我的基于web3 3的事件应用程序的页面工作正常，直到我进入我的“过去的事件”并点击“与会者”。当我这样做时，我会得到语法错误:意外的标记。
这个问题特别出现在我的代码for (让i= 0；< event.confirmedAttendees.length；i++) {上。在VS代码中，我有4个错误，所有这些都指向这一行。这些错误是“解析错误:意外令牌”、2“标识符预期”错误和1“预期表达式”。
我已经对照GitHub回购检查了代码，然后编辑了整个项目文件，现在所有的代码都匹配了。
我刚开始编码，以前没有JS经验。我一整天都在抓我的头。我不知道这是什么问题。
这是我的id.js文件中的全部代码。问题是第86行。
import { useState, useEffect } from "react";
import Head from "next/head";
import Link from "next/link";
import { gql } from "@apollo/client";
import client from "../../../apollo-client";
import { ConnectButton } from "@rainbow-me/rainbowkit";
import { useAccount } from "wagmi";
import connectContract from "../../../utils/connectContract";
import formatTimestamp from "../../../utils/formatTimestamp";
import DashboardNav from "../../../components/DashboardNav";
import Alert from "../../../components/Alert";
function PastEvent({ event }) {
const { data: account } = useAccount();
console.log("event", event);
const [success, setSuccess] = useState(null);
const [message, setMessage] = useState(null);
const [loading, setLoading] = useState(null);
const [mounted, setMounted] = useState(false);
const confirmAttendee = async (attendee) => {
try {
const rsvpContract = connectContract();
if (rsvpContract) {
const txn = await rsvpContract.confirmAttendee(event.id, attendee);
setLoading(true);
console.log("Minting...", txn.hash);
await txn.wait();
console.log("Minted -- ", txn.hash);
setSuccess(true);
setLoading(false);
setMessage("Attendance has been confirmed.");
} else {
console.log("Ethereum object doesn't exist!");
}
} catch (error) {
setSuccess(false);
// setMessage(
// `Error: ${process.env.NEXT_PUBLIC_TESTNET_EXPLORER_URL}tx/${txn.hash}`
// );
setMessage("Error!");
setLoading(false);
console.log(error);
}
};
const confirmAllAttendees = async () => {
console.log("confirmAllAttendees");
try {
const rsvpContract = connectContract();
if (rsvpContract) {
console.log("contract exists");
const txn = await rsvpContract.confirmAllAttendees(event.id, {
gasLimit: 300000,
});
console.log("await txn");
setLoading(true);
console.log("Mining...", txn.hash);
await txn.wait();
console.log("Mined -- ", txn.hash);
setSuccess(true);
setLoading(false);
setMessage("All attendees confirmed successfully.");
} else {
console.log("Ethereum object doesn't exist!");
}
} catch (error) {
setSuccess(false);
// setMessage(
// `Error: ${process.env.NEXT_PUBLIC_TESTNET_EXPLORER_URL}tx/${txn.hash}`
// );
setMessage("Error!");
setLoading(false);
console.log(error);
}
};
function checkIfConfirmed(event, address) {
// console.log(event.confirmedAttendees);
for (let i = 0; < event.confirmedAttendees.length; i++) {
let confirmedAddress = event.confirmedAttendees[i].attendee.id;
if (confirmedAddress.toLowercase() == address.toLowercase()) {
return true;
}
}
return false;
}
useEffect(() => {
setMounted(true);
}, []);
return (
mounted && (
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<Head>
<title>My Dashboard | web3rsvp</title>
<meta name="description" content="Manage your events and RSVPs" />
</Head>
<div className="flex flex-wrap py-8">
<DashboardNav page={"events"} />
<div className="sm:w-10/12 sm:pl-8">
{loading && (
<Alert
alertType={"loading"}
alertBody={"Please wait"}
triggerAlert={true}
color={"white"}
/>
)}
{success && (
<Alert
alertType={"success"}
alertBody={message}
triggerAlert={true}
color={"palegreen"}
/>
)}
{success === false && (
<Alert
alertType={"failed"}
alertBody={message}
triggerAlert={true}
color={"palevioletred"}
/>
)}
{account ? (
account.address.toLowerCase() ===
event.eventOwner.toLowerCase() ? (
<section>
<Link href="/my-events/past">
<a className="text-indigo-800 text-sm hover:underline">
← Back
</a>
</Link>
<h6 className="text-sm mt-4 mb-2">
{formatTimestamp(event.eventTimestamp)}
</h6>
<h1 className="text-2xl tracking-tight font-extrabold text-gray-900 sm:text-3xl md:text-4xl mb-8">
{event.name}
</h1>
<div className="-my-2 -mx-4 overflow-x-auto sm:-mx-6 lg:-mx-8">
<div className="inline-block min-w-full py-2 align-middle md:px-6 lg:px-8">
<div className="overflow-hidden shadow ring-1 ring-black ring-opacity-5 md:rounded-lg">
<table className="min-w-full divide-y divide-gray-300">
<thead className="bg-gray-50">
<tr>
<th
scope="col"
className="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-6"
>
Attendee
</th>
<th
scope="col"
className="text-right py-3.5 pl-3 pr-4 sm:pr-6"
>
<button
type="button"
className="items-center px-4 py-2 border border-transparent text-sm font-medium rounded-full text-indigo-700 bg-indigo-100 hover:bg-indigo-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500"
onClick={confirmAllAttendees}
>
Confirm all
</button>
</th>
</tr>
</thead>
<tbody className="divide-y divide-gray-200 bg-white">
{event.rsvps.map((rsvp) => (
<tr key={rsvp.attendee.id}>
<td className="whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-gray-900 sm:pl-6">
{rsvp.attendee.id}
</td>
<td className="relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm font-medium sm:pr-6">
{checkIfConfirmed(event, rsvp.attendee.id) ? (
<p>Confirmed</p>
) : (
<button
type="button"
className="text-indigo-600 hover:text-indigo-900"
onClick={() =>
confirmAttendee(rsvp.attendee.id)
}
>
Confirm attendee
</button>
)}
</td>
</tr>
))}
</tbody>
</table>
</div>
</div>
</div>
</section>
) : (
<p>You do not have permission to manage this event.</p>
)
) : (
<ConnectButton />
)}
</div>
</div>
</div>
)
);
}
export default PastEvent;
export async function getServerSideProps(context) {
const { id } = context.params;
const { data } = await client.query({
query: gql`
query Event($id: String!) {
event(id: $id) {
id
eventID
name
eventOwner
eventTimestamp
maxCapacity
totalRSVPs
totalConfirmedAttendees
rsvps {
id
attendee {
id
}
}
confirmedAttendees {
attendee {
id
}
}
}
}
`,
variables: {
id: id,
},
});
return {
props: {
event: data.event,
},
};
}
回答 1
Stack Overflow用户
回答已采纳
发布于 2022-09-13 07:07:45
在这个函数中，您似乎错过了for循环检查中的i：
function checkIfConfirmed(event, address) {
// console.log(event.confirmedAttendees);
for (let i = 0; < event.confirmedAttendees.length; i++) {
let confirmedAddress = event.confirmedAttendees[i].attendee.id;
if (confirmedAddress.toLowercase() == address.toLowercase()) {
return true;
}
}
return false;
}请看一下函数中的第二行：
// currently:
for (let i = 0; < event.confirmedAttendees.length; i++)
// missing i in the check, should be:
for (let i = 0; i < event.confirmedAttendees.length; i++)让我知道，如果有什么似乎不清楚的循环！
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/73697053
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号