el-input 怎么实现动态禁用

发布于 2022-09-12 13:37:25 字数 546 浏览 18 评论 0

使用el-input 想实现动态禁用 当失去焦点时禁用input,点击input时 重新获取焦点取消禁用 我现在的写法禁用后没有办法重新获取焦点取消禁用,想知道怎么实现

<el-input
  v-model="state"
  :disabled="sss"
  placeholder="请输入内容"
  @focus="focusff"
  @blur="blurdd"
/>
data() {
      return {
        state: ''
        sss: true
      };
    },
methods: {
      blurdd() {
        this.sss = true
        console.log('触发1')
      },
      focusff() {
        this.sss = false
        // if(input.blur) {return this.sss = true };
        console.log('触发2')
      },

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

千纸鹤 2022-09-19 13:37:25

把聚焦事件改为点击事件,然后判断禁用状态,如果是禁用状态就取消禁用并聚焦,如果已经聚焦则不做处理

时间海 2022-09-19 13:37:25

你的需求:‘失去焦点时禁用input,点击input时 重新获取焦点取消禁用’。
实现:

    <el-input
      ref="myButton"
      v-model="state"
      :disabled="sss"
      placeholder="请输入内容qqqq"
      @click.native="clickEvent"
      @blur="blurdd"
    />
    
    blurdd() {
      this.sss = true
      console.log('触发1')
    },
    clickEvent(event) {
      console.log('触发2')
      this.sss = false
      this.$nextTick(() => {
        this.$refs.myButton.focus()
      })
    },
    
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文