时间戳

首页 > 解决方案 > vue v-if="isEditable" @click.prevent

javascript - vue v-if="isEditable" @click.prevent

问题描述

我有

Vue.component ('test', {
template: '<div 
    '@click="imageHelperClick($event)"  ' +
    '@mouseout="mouseoutHelper" ' +
    'class="el-hover image-hover" :data-div-id="helper.htmlId">' +
    '<transition name="fade"><span v-if="helper.mouseover">Press to load image</span></transition>' +
    '<size-check-input ref="fileInput" type="file" data-upload-check @change="imageSelected($event)" accept=".eps,image/x-png,image/jpeg"/>' +
    '</div>',
methods:{...},

helper.isEditable==true如果不是可点击、可触摸等，我想让该 div 可点击。

复杂性在于，只有当 document.ready 和服务器向我发送有关 field 的信息时，我才会获得该参数isEditable。

所以，我的问题是：

我可以做吗

computed:{
isEditable: function(){
return helper.isEditable;
}
}

然后做类似的事情

v-if = "isEditable" @click.prevent @mouseOver.prevent 
v-else @click="imageHelperClick($event)" @mouseout="mouseoutHelper"

ETC？

标签： javascriptvue.js

解决方案

Vue 没有这样的语法。你可以试试

:disabled="yourFlag"

并切换yourFlag以使其可点击或不可点击

推荐阅读