Vue

HTML

<div id="app">
  <div>
    <button @click="click('a')">{{a.text}}</button>
    <span :style="{color: a.color}">{{a.color}}</span>
    {{a.image}}
  </div>

  <div :color="b.color">
    <button @click="click('b')">{{b.text}}</button>
    <span :style="{color: b.color}">{{b.color}}</span>
    {{b.image}}
  </div>
</div>

Vue

new Vue({
  el: "#app",
  data: {
  	a: {
     	text: "A",
    	color: "red",
      image: "ringo.jpg"
    },
    b: {
    	text: "B",
    	color: "red",
      image: "banana.jpg"
    }
  },
  methods: {
  	click (clickedBtn) {
      if (clickedBtn === "a") {
    		this.a.color = "blue"
    		this.a.image = "banana.jpg"
      	this.b.text = "C"
    		this.b.image = "melon.jpg"
      } else if (clickedBtn === "b") {
      	if (this.b.text === "B") {
        	
        } else if (this.b.text === "C") {
        	this.a.color = "red"
         	this.a.image = "ringo.jpg"
          this.b.text = "B"
          this.b.image = "banana.jpg"
        }
      }
    }
  }
})