javascript - vue changes current node element

Question

my question is. Click 1111 and then 111 is hidden and 222 is displayed. . The question is, how do I hide the sibling elements instead of all 2222? ?
One more question

How to use this syntax? ? Isn't this function b(return a 1)? ?

Answer 1

First question: You should use it according to Vue’s rules

<p id="app">
  <ul>
    <li v-for="item in items">
      <p v-if="item.visible" v-text="item.content1" @click="item.visible=false"></p>
      <p v-if="!item.visible" v-text="item.content2" @click="item.visible=true"></p>
    </li>
  </ul>
</p>

new Vue({
  el: '#app',
  data() {
    return {
      items: [{
        content1: "11111",
        content2: "22222",
        visible: true
      }, {
        content1: "33333",
        content2: "44444",
        visible: true
      }]
    }
  }
});

Online demo: https://jsfiddle.net/n6sga9v2/

Second question:

Are you talking about arrow functions? If so, then the grammar you use is wrong. There is a short article you can read

ES2015 Getting Started Series 3-Arrow Function

Answer 2

1. Control different elements with different attributes

2. const b = () => d + 1

Learn the basics of JS before asking questions.