laravel 如何在 vuejs 中禁用按钮
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/54876820/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to disable button in vuejs
提问by mohamed lahsoumi
I want to make the button disabled during the form filling when all the inputs are filled the button will be enabled using vuejs and on laravel framework
我想在填写所有输入时禁用按钮
I tried achive that by simply making the button disabled in the
我试图通过简单地在
<button type="submit" class="btn btn-info" disabled>Next</button>
but i didn't know how to do it in vuejs
但我不知道如何在 vuejs 中做到这一点
回答by Roy J
Just bind the disabled
attribute to a boolean value like
只需将disabled
属性绑定到一个布尔值,如
<button :disabled='isDisabled'>Send Form</button>
as in this example
回答by Tharaka Dilshan
You can use a computed propertyto make the button enable / disable. Each time the condition changes inside the computed property, the button disable or enable will be rendered. The condition should be a boolean.
您可以使用计算属性来启用/禁用按钮。每次计算属性内的条件发生变化时,将呈现按钮禁用或启用。条件应该是一个布尔值。
<template>
...
<button type="submit" class="btn btn-info" :disabled="isDisabled">Next</button>
...
</template>
<script>
export default {
computed: {
isDisabled() {
// you can check your form is filled or not here.
return yourCondition == true
},
},
}
</script>
回答by trueChazza
https://vuejs.org/v2/guide/syntax.html#Attributes
https://vuejs.org/v2/guide/syntax.html#Attributes
<button type="submit" class="btn btn-info" :disabled="validated">Next</button>
Bind the disabled
attribute to a boolean value, once validated, or in your case all inputs are filled return true
将disabled
属性绑定到一个布尔值,一旦验证,或者在你的情况下,所有输入都被填充返回true