Element Plus组件库中的input组件如何点击查看按钮时不可编辑,点击编辑时可编辑使用setup

如果你正在使用 Vue 3 和 Composition API,你可以使用 setup 函数来实现 Element Plus 的 Input 组件在点击查看按钮时不可编辑,点击编辑按钮时可编辑的功能。

以下是一个使用 setup 的示例代码:




在上述示例中,我们使用了 ref 函数来创建 inputValueisDisabled 变量,并在 setup 函数中返回它们。通过在模板中绑定 v-model 指令和 :disabled 属性,我们可以动态地控制输入框是否可编辑。

在按钮的点击事件处理函数 toggleEdit 中,我们只需要修改 isDisabled 变量的值,输入框的可编辑

你可能感兴趣的:(vue,vue.js,前端,javascript)