vue 动态控制input输入框的disabled属性

 最近项目上提出一个经常遇到的需求,点击新增时input可输入,点击编辑时input置灰。写下过程,希望能帮助到大家。

  vue 动态控制input输入框的disabled属性_第1张图片

  vue 动态控制input输入框的disabled属性_第2张图片

 1.首先在input上添加disabled属性

      

 

  2.data中定义isDisabled值为false(可编辑)

  

  3.在新增的点击事件中设置isDisabled=false(可编辑) . 编辑的点击事件中设置isDisabled=true(不可编辑).

   

 

 

     最后的效果就是文章最开头啦!       

                                                                                                ☽

你可能感兴趣的:(vue,javascript)