Blockchain code Metaverse VR

SmartContract×VR×Crypto(592)

スポンサーリンク

//tips

//smart contract

時刻スタンプの追加表示を組み込む。

ドキュメントにtimeフィールドを追加。

Titleと同様に 下記の形で取得してしまう。

{xitem[index].title}
{item}
time: {xitem[index].time}

Boardスクリプトの方にpile.time = data.time?data.time:nullを追加しておく。

これで追加できるようになった。
Onclickをnoteにつけて別のページに飛ばし、そちらでコメントを記入できるようにする。

{ninja[0]&&
<div>
<Boardedit item={ninja}/>
</div>
}

各ボードのドキュメントに対してidを割り当てて、ページとして表示させるようにする。

これはダイナミックパス作成の流れ。

Pagesフォルダの中にBoardフォルダを作成する。Boardフォルダの中に[bid].jsを作成。

まずは[id].jsの内容をそのまま組み込み改変。

//受け取るcontextの内容を編集
export const getStaticPaths = async () => {

let posts = []

const colRef=await collection(firebaseApp, "Board")

await getDocs(colRef)
.then((snapshot)=>{
snapshot.docs.forEach(doc => {
posts.push(JSON.stringify(doc.data().bid))

});

}).then(()=>console.log(posts))

const paths = posts.map(ninja => {
return {
params: { id:ninja.toString() }
}
})
console.log('paths')

return {
paths,
fallback: false
}
}

//contextは{ params: { id: '2' },などの内容で取得
export const getStaticProps = async (context) => {

let posts = []

const id = parseInt(context.params.id)

const colRef= await collection(firebaseApp, "Board")

const q = await query(colRef,where("bid","==",id))

await getDocs(q)
.then((snapshot)=>{

snapshot.docs.forEach(doc => {
const data = doc.data()

const pile={}

pile.bid = data.bid?data.bid:null
pile.mail = data.mail ?data.mail:null
pile.text = data.text?data.text:null
pile.time = data.time?data.time:null

pile.title = data.title?data.title:null

pile.userid = data.userid

posts.push(pile)

});

})//.then(()=>console.log(posts))

return {
props: { ninja: posts }
}
}

シンプルにhttp://localhost:3000/Board/1としたがエラー。

error - Error: A required parameter (bid) was not provided as a string in getStaticPaths for /Board/[bid]

なぜか.toStringが効いていないと思ったら[id].jsにすれば良いだけだった。bidは[id]のなかに格納する数値なので[bid]とする必要はなかった。

これにて無事に表示された。

http://localhost:3000/Board/1に飛ぶとbidが1のドキュメントを取得し、ninjaに下記のように格納したデータを渡してくれた。

0:
bid: 1
mail: "naki@gmail.com"
text: (2) [{…}, {…}]
time: 8888888
title: "テスト2"
userid: 1

シンプルにBoardで表示した内容をこちらにも映す。

しっかり表示させることができた。

テキストフィールドを組み込み、データベースに追加させる場所を作ると同時にログイン認証を行う。あとはUIを整えれば形ができる。

休日はデプロイ済みのコードを見て、自身のNFTのセキュリティに問題ないか確認を行う。最近ハッキングなどが身近で起こっているから流石に気になる。怖すぎるわ。

人気の記事

1

皆さん、ついに、エアラインでも、サブスクリプションが始まったのはご存じですか? まだ実験段階ですが、ANAが、定額全国住み放題サービスを提供する「ADDress」と組んで、国内線を4回まで定額利用可能 ...

2

無料でネットショップを開けるアプリとして多くの人に驚きを与えたBASE株式会社が、2019年10月25日東証マザーズに上場しました。2020年2月時点で90万店を超えるショップを抱えるまでに成長してい ...

3

2011年にサービスを開始してから圧倒的な成長率を誇るインテリア通販サイト 【FLYMEe/フライミー】を皆さんご存じでしょうか。 「自分のイメージするインテリア、本当に欲しいインテリアがどこにあるの ...

4

ついに、noteの月間アクティブユーザー数が4400万人(2020年3月時点)に到達しました。 そもそも、「note」とは、クリエイターが、文章やマンガ、写真、音声を投稿することができ、ユーザーはその ...

5

ボードゲームカフェが1日2回転で儲かるという記事をみつけたので興味を持ち、調べてみました。 まずは、需要がどれくらいあるのか、市場のようすからみていきましょう。 世界最大のボードゲーム市場はドイツで、 ...

-Blockchain, code, Metaverse, VR
-, ,

Copyright© BUSINESS HUNTER , 2023 All Rights Reserved Powered by AFFINGER5.