みっこー【NoCode】
【Bubble】Type of content 解説

【Bubble】Type of content 解説

みっこー【NoCode】

Bubble学習時に「Type of content」について雰囲気で把握していたのでこの記事で纏めていきたいと思います。(※間違いあれば指摘お願いします。)

Type of contentとは?

Bubbleで扱うページ、またはエレメント(グループとか)に「Type of contet」の項目があります。

indexページ

画像1

RepeatingGroup(エレメント)

画像2

「Type of content」に作成したデータベースを紐付けすることによりデータベースのデータを参照できるようになります。

実際の事例紹介

RepeatingGroupを使って「Tweetデータベース」のデータを繰り返し表示する場合の「Type of content」の役割

RepeatingGroupに「Tweet」というデータベースTypeを設定した場合

画像2

画像9

画像3

「Type of content:Tweet」と設定した場合、RepeatingGroup内に配置したTextエレメントに「Current cell’s Tweet」と入力できます。

RepeatingGroupの「Type of content」を設定していない場合

画像7

画像6

設定時に表示されていた「Current cell’s Tweet」が無く、「Current cell’s Thing」となります。

「Current cell’s Thingで上手いことできないのか?」と思い
実際にやってみた結果

画像9

画像10


「change the parent's thing type...」と表示され、親要素(今回ではRepeatingGroup)のTypeを設定してと出ます。ここで設定した値が「Type of content」に入るようになっています。

RepeatingGroupを使ってデータの表示をする際は「何のデータを表示したいか?」を考えたうえで「Type of content」に参照したいデータベースTypeを設定する必要があるようです。

ページ間の値の受け渡し時の「Type of content」の役割

ページ間の値の受け渡しについてはノーコードラボさんの記事で詳細に説明されてますので是非見てください。

記事の中で紹介されてますが、ページ移動時に「Data to send」によって移動後のページにデータ(クリックしたツイート文の情報など)を送ることができますが、その条件として移動後のページとタイプが一致させる必要があります。

例として、ツイート文(データベースType:Tweet)の情報を送りたい→移動先のページの「Type of content:Tweet」とすることで「Data to send」を使用することができるようになります。

まとめ

データベースの値を参照させたい場合には「Type of content」に設定する必要があるということ、「Data to send」を使う場合は必ずページに設定をする必要がある。

「RepeatingGroup(エレメント)に設定すればいいか?」、「ページに設定する必要があるのか?」この判断を間違えないように気を付けないといけないなと思いました。



この記事が気に入ったら、サポートをしてみませんか?
気軽にクリエイターの支援と、記事のオススメができます!
みっこー【NoCode】
NoCodeツールでアプリ開発を目指して日々勉強中です!