VueJS 有条件地为元素添加属性

javascript vue.js vuejs2

2022-08-30 01:17:40

在 VueJS 中，我们可以使用 v-if 添加或删除 DOM 元素：

<button v-if="isRequired">Important Button</button>

但是有没有办法添加/删除dom元素的属性，例如对于以下条件设置所需的属性：

Username: <input type="text" name="username" required>

通过类似于以下内容的内容：

Username: <input type="text" name="username" v-if="name.required" required>

有什么想法吗？

答案 1

尝试：

<input :required="test ? true : false">

更新：它在 Vue 3 中已更改，请参阅此答案 https://stackoverflow.com/a/64598898

答案 2

最简单的形式：

<input :required="test">   // if true
<input :required="!test">  // if false
<input :required="!!test"> // test ? true : false