通过从后台获取的字段的值来控制按钮的显示与隐藏

首先，用 v-if 绑定 isNeedAudit，根据其值为 true 或者 false 来控制按钮的显示与隐藏：

<el-button v-if="isNeedAudit"
             size="mini"
             type="warning"
             round
             plain
             @click="auditTask">
     {{ $t('common.audit') }}
</el-button>
在 data 中初始化 isNeedAudit 的值：
 
data() {
    return {
      isNeedAudit: false
created 钩子函数中请求后台接口：
 
 created() {
    this.queryParam()
methods 中实现请求接口的方法，将后台获取的值赋给 isNeedAudit：
 
// 查询taskNeedAudit参数的paramvalue
    async queryParam() {
      try {
        const param = {
          name: 'taskNeedAudit'
        const res = await paramsApi.getVal(param)
        if (res == 'true') {
          this.isNeedAudit = true
        } else {
          this.isNeedAudit = false
        console.log('是否需要审核', this.isNeedAudit, typeof this.isNeedAudit)
      } catch (e) {
        this.Message(e, 'error')
需要注意的是，从后台获取的 res 为 string 类型，而 isNeedAudit 需要为 Boolean 类型才可以，所以需要处理一下。
 
如下，当 isNeedAudit 为 true 时，显示“审核”按钮：
 
 当isNeedAudit为false时，隐藏“审核”按钮。
 
                    &lt;el-button v-if="isNeedAudit"             size="mini"             type="warning"             round             plain             @click="auditTask"&gt;     {{ $t('common.audit') }}&lt;/el-bu...
				
Vue可以通过使用v-if条件指令来控制数据的有无对按钮的显示与隐藏，例如：<button v-if="buttonVisible">按钮</button>，其中buttonVisible为一个布尔型的数据，当它为true时，按钮将被显示；当它为false时，按钮将被隐藏。
				
工作中有一个需求就是，对未收货的订单可以进行收货确认；但是已经确认收货的订单如果继续收货确认后台会报错；为了解决这个问题，可以在列表选择时，如果勾选了已经收货确认的订单把收货确认按钮隐藏起来；
前端代码如下:
<div v-if="isShow" class="fr of p10" >
                <button class="mr10 main_btn" @click="confirm">收货确认</button>