vue-点击按钮取反

62 阅读 0 评论 41 点赞

我是靠谱客的博主高挑皮皮虾，这篇文章主要介绍vue-点击按钮取反，现在分享给大家，希望可以做个参考。

vue页面展示状态与点击按钮相反

如图:
在这里插入图片描述
开始做得时候，一直想得是写一个就行了，然后迷茫，第二天直接有了新的想法，写两个按钮，符合哪个条件，显示哪个按钮。

注意：
判断条件是与要显示得结果相反的（下架按钮的判断条件0，上架按钮的判断条件1，其中0是上架，1是下架）

代码：

		  <el-button
            v-if="scope.row.launchType == '0'"
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="sxjUpdate(scope.$index,scope.row)"
            v-hasPermi="['onlineEdu:eduOperateInformation:UpdatePutAway']"
          >下架
          </el-button>

          <el-button
            v-if="scope.row.launchType == '1'"
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="sxjUpdate(scope.$index,scope.row)"
            v-hasPermi="['onlineEdu:eduOperateInformation:UpdatePutAway']"
          >上架
          </el-button>