JavaScript - ページ上のいくつかの場所をクリックして表示し、クリックして非表示にする必要があります。これを Vue で実装するにはどうすればよいですか?

Question

図に示すように、最初の li をクリックすると、li のすべての p が表示されます。
2番目のliをクリックすると、1番目のli、3番目のliも変化していますが、どのliをクリックして、どのliのp要素を表示するにはどうすればよいでしょうか？ 。 。

Answer 1

1つ設定current

リーリー リーリー

Answer 2

コードを見れば分かります:

Answer 3

1階が正解。 v-if も使用できます。ただし、@click バインディング関数はメソッド内でより標準化された方法で記述することをお勧めします。

Answer 4

データドリブンを考える⤴

Answer 5

これはイベント委任を使用して記述する必要がありますか?クリックをulにバインドし、クリックされたevent.targetがどのliであるかを判断して、表示を切り替えると、うまくいくはずです

Answer 6

3つの変数を設定します