博客

(vue)vue实现点赞反馈功能：

// 第一步
<div class="fankui-box">
	 <img v-if="manyi == false" :src="alarmImg1" @click="insertAttr1" />
	 <img v-if="manyi == true" :src="alarmImg2" @click="insertAttr1" />
	 对结果满意
</div>
<div class="fankui-box">
	 <img v-if="bumanyi == false" :src="alarmImg3" @click="insertAttr2" />
	 <img v-if="bumanyi == true" :src="alarmImg4" @click="insertAttr2" />
	 对结果不满意
</div>

// 第二步
 data() {
   return {
     alarmImg1: require("@/assets/images/White.jpg"),
     alarmImg2: require("@/assets/images/Active.jpg"),
     alarmImg3: require("@/assets/images/UnWhite.jpg"),
     alarmImg4: require("@/assets/images/UnActive.jpg"),
     manyi: false,
     bumanyi: false,
   };
 },
 
// 第三步 
insertAttr1() {
  this.manyi = !this.manyi;
  this.bumanyi = false;
  if (this.manyi == true) {
    addFeedback({
      title: this.text,
      status: "1",
      note: "",
      type: "1",
      userName: this.loginName,
    }).then((res) => { 
    });
  }
},
insertAttr2() {
  this.bumanyi = !this.bumanyi;
  this.manyi = false;
  if (this.bumanyi == true) {
    addFeedback({
      title: this.text,
      status: "2",
      note: "",
      type: "1",
      userName: this.loginName,
    }).then((res) => { 
    });
  }
},

效果 ：