コード
- 要素数的なものは取れないのかな、、、
- tableはテーブル全体
- thはテーブルの見出し(table head cell)
- tdはテーブル内のデータ(table data)
- trはテーブルの横の定義(table row)
- アロー関数のループの中でテーブルを定義する感じ
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<span class="p"><</span><span class="nt">div</span><span class="p">></span> <span class="p"><</span><span class="nt">table</span> <span class="na">border</span><span class="p">=</span><span class="s">"1"</span> <span class="na">width</span><span class="p">=</span><span class="s">"500"</span> <span class="na">cellPadding</span><span class="p">=</span><span class="s">"0"</span><span class="p">></span> <span class="p"><</span><span class="nt">th</span><span class="p">></span>No<span class="p"></</span><span class="nt">th</span><span class="p">></span> <span class="p"><</span><span class="nt">th</span><span class="p">></span>Name<span class="p"></</span><span class="nt">th</span><span class="p">></span> <span class="p"><</span><span class="nt">th</span><span class="p">></span>Status<span class="p"></</span><span class="nt">th</span><span class="p">></span> <span class="si">{</span><span class="k">this</span><span class="p">.</span><span class="nx">state</span><span class="p">.</span><span class="nx">pods</span><span class="p">.</span><span class="nx">map</span><span class="p">((</span><span class="nx">pod</span><span class="p">)</span> <span class="o">=></span> <span class="p"><</span><span class="nt">tr</span><span class="p">></span> <span class="p"><</span><span class="nt">td</span><span class="p">></span><span class="si">{</span><span class="nx">pod</span><span class="p">.</span><span class="nx">id</span><span class="si">}</span><span class="p"></</span><span class="nt">td</span><span class="p">></span> <span class="p"><</span><span class="nt">td</span><span class="p">></span><span class="si">{</span><span class="nx">pod</span><span class="p">.</span><span class="nx">metadata</span><span class="p">.</span><span class="nx">name</span><span class="si">}</span><span class="p"></</span><span class="nt">td</span><span class="p">></span> <span class="p"><</span><span class="nt">td</span><span class="p">></span><span class="si">{</span><span class="nx">pod</span><span class="p">.</span><span class="nx">status</span><span class="p">.</span><span class="nx">phase</span><span class="si">}</span><span class="p"></</span><span class="nt">td</span><span class="p">></span> <span class="p"></</span><span class="nt">tr</span><span class="p">></span> <span class="p">)</span><span class="si">}</span> <span class="p"></</span><span class="nt">table</span><span class="p">></span> <span class="p"></</span><span class="nt">div</span><span class="p">></span> |
画面