Blockchain code Metaverse VR

SmartContract×VR×Crypto(568)

スポンサーリンク

//tips

//smart contract

ログインを押すことでauthuseridがセットできるようになったので、[id]ページのメッセージブタンクリックでconst myid=localStorage.getItem('authuserid’)取得手続きの方向がきちんと定められた。

const handleClickMessage = (e) => {
e.preventDefault();

//クリック時点で[id]の登録
localStorage.setItem('Sender',ninja[0].userid)
console.log('handleClickMessage')
console.log(ninja[0].userid)

const myid=localStorage.getItem('authuserid')

if(myid){
console.log('Success!')
router.push('/ID/'+myid+'/Message')
}else{
router.push("/login")
}

}

ここで自身のMessageページに遷移する。

このメッセージページで特殊な点はデータベースでのコレクションをメッセージ専用のものに切り替えている点。

ただ、やることはシンプルでメッセージ用のコレクションから自身が受信したもの、送信したもののデータ群を取得して表示させる。

送り手・受け手の記載がややこしくなったので[id]にて受取手をTowhomでセット。

const handleClickMessage = (e) => {
e.preventDefault();

//クリック時点で[id]の登録
localStorage.setItem('Towhom',ninja[0].userid)

pile.Towhom = data.Towhom ?data.Towhom:null

この後に自身のメッセージページに遷移してこのTowhomのuserid宛にメッセージを送ることができれば良い。

このTowhomで取得したuseridに紐づいたusernameとstoragelinkも欲しいところ。もちろん自身のものも欲しい。

登録時点でメッセージコレクションの方にも初期登録及び画像登録・変更が共有されるようにしておいた方がよいか。そうするとせっかく分けた意味がないので、ベースのデータを呼び出して使うことにする。

メッセージページはそこまで重くなる要素もないので、ダブルでの運用をトライ。

Useridをトリガーにして、usernameとstoragelinkを引っ張ることができれば良い。

ベースデータからstoragelinkでフィルターをかけ、そのドキュメント内のuseridとusernameを一種に取得したものをリスト化しすればよさそう。

まずはリストの抽出をトライ。

こちらを改造する。

let posts = []

const id = parseInt(context.params.id)

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

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

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

snapshot.docs.forEach(doc => {
const data = doc.data()
console.log('data.title')

const pile={}
//条件式 ? trueの処理 : falseの処理
pile.userid = data.userid
pile.username = data.username

pile.storagelink = data.storagelink?data.storagelink:null

posts.push(pile)

});

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

特定のフィールドがあるドキュメントのみを取り出すにはorderByを使用する必要があるのとのこと。

Firestore Get All Documents Where a Specific Field Exists or Does Not Exist

試しに下記で作成してみて実行。

const [mixlist,setmixlist]=useState([])

async function Datamixlist() {
const colRef= await collection(firebaseApp, "mydata").orderBy('storagelink')
//const q = await query(colRef,where("userid","==",id))

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

snapshot.docs.forEach(doc => {
const data = doc.data()
console.log('data.title')

const pile={}
//条件式 ? trueの処理 : falseの処理
pile.userid = data.userid
pile.username = data.username

pile.storagelink = data.storagelink?data.storagelink:null

mixlist.push(pile)

});

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

Datamixlist()

Orderbyで謎のエラーが発生。.where('tags', '!=', null)の形式で試してみる。

const q = await query(colRef,where("storagelink", '!=', null))

最短のループ回数でリスト取得を行うことができた。かなりの頻度で際読み込み・再実行となっているのが気になる。ここは後で見直し。

const [mixlist,setmixlist]=useState([])
const [mixdone,setmixdone]=useState(false)

function Datamixlist() {

let posts = []
const colRef= collection(firebaseApp, "mydata")//.orderBy('storagelink')
const q = query(colRef,where("storagelink", '!=', null))

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

snapshot.docs.forEach(doc => {
const data = doc.data()
console.log('data.title')

const pile={}
//条件式 ? trueの処理 : falseの処理
pile.userid = data.userid
pile.username = data.username

pile.storagelink = data.storagelink?data.storagelink:null

posts.push(pile)

});

}).then(()=>console.log(posts)).then(()=>setmixlist(posts)).then(()=>setmixdone(true))

}

if(!mixdone){
Datamixlist()
}

storageへの画像登録がマストとなってしまうが、こちらのアプリの前提がアバター使用なので問題ない。その代わり、画像登録は公開する上でマストの設定にするか。

リストは取得できたのでmapで展開しつつ、展開の中身とTowhomに格納したuseridと合致させ,
必要な部分を取れるようにすれば良い。

取得した内容で名前とアバター表示を可能にする。その下にテキストフィールドを設置すれば良い。

人気の記事

1

コロナによる需要変化 コロナパンデミックの影響で、人々は外に出られなくなり、自宅で過ごす時間が増えました。 この自粛ムードの中、下記のようなビジネスの需要変化が引き起こされています。 【利用者減少】 ...

2

米国レストランの決済時に毎日お世話になっていた「Square」のビジネスモデルについて本日はふれていきたいと思います。 「Square」とは、ネットにつながったモバイル端末と専用のカードリーダーを用意 ...

3

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

4

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

5

ナイキのSNKRSが、なぜこれほどまでに人気なのか?調べてみました。 きっかけは米国での友達との会話。彼は自分のシューズをみせて、「これ20万円もしたんだぜ。」と語ってくれました。 あまり靴に興味がな ...

-Blockchain, code, Metaverse, VR
-, ,

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